4

会場の表を表示するためにko.jsを使用しています。

各会場には、編集可能なデータを表示するダイアログを表示する編集ボタンがあります。

編集ボタンを押すと、会場をダイアログにバインドし、データのコピーを元に戻すオブジェクトに保存します。

ダイアログのフィールドを編集すると、ダイアログとテーブルの両方が更新されます。

編集をキャンセルすると、会場をオブジェクトの元に戻す状態にバインドします。これによりダイアログは更新されますが、テーブルでは更新されません。

私がここで間違っていることについて何か考えはありますか？

これが私のビューモデルです。

VenueViewModel = function(venues) {
    var self = this;

    var venueModal = $("#venueModal");
    this.venues = ko.mapping.fromJS(venues);
    this.venue = ko.observable();
    this.venueUndo = null;

    //Cancel an edit                
    this.cancel = function() {
        self.venue(ko.mapping.fromJS(self.venueUndo));
        venueModal.modal("hide");
    }

    //Edit an existing venue
    this.edit = function(venue) {
        self.venue(venue);
        self.venueUndo = ko.mapping.toJS(venue);
        venueModal.modal("show");
    };

    //Create a new venue
    this.create = function() {
        self.venue(new Venue());
        venueModal.modal("show");
    };
};

ko.applyBindings(new VenueViewModel(venues));
4

4 に答える 4

1

彼のコメントにリンクされている記事nemesvが答えでした。

http://www.knockmeout.net/2013/01/simple-editor-pattern-knockout-js.html

于 2013-02-11T11:54:00.140 に答える
1

これには、 KO-UndoManagerの使用を検討してください。ビューモデルを登録するためのサンプルコードは次のとおりです。

VenueViewModel.undoMgr = ko.undoManager(VenueViewModel, {
  levels: 12,
  undoLabel: "Undo (#COUNT#)",
  redoLabel: "Redo"
});

次に、次のようにHTMLに元に戻す/やり直しボタンを追加できます。

 <div class="row center-block">
    <button class="btn btn-primary" data-bind="
      click: undoMgr.undoCommand.execute, 
      text: undoMgr.undoCommand.name, 
      css: { disabled: !undoMgr.undoCommand.enabled() }">UNDO</button>
    <button class="btn btn-primary" data-bind="
      click: undoMgr.redoCommand.execute, 
      text: undoMgr.redoCommand.name, 
      css: { disabled: !undoMgr.redoCommand.enabled() }">REDO</button>
  </div>

そして、これが実際の動作を示すPlunkrです。

于 2014-12-21T21:08:21.770 に答える
0

ノックアウトオブザーバブルを次のように設定します。

self.venue(ko.mapping.fromJS(self.venueUndo));
于 2013-02-09T21:06:16.540 に答える
0

Knockout.jsには、オブザーバブルを拡張するプロジェクトの一部として小さな拡張機能があります。これにより、オブザーバブルを履歴のさまざまなスタックに登録できます。

多分それはあなたを助けることができます。

ノックアウト-メメント

于 2014-03-02T13:29:03.037 に答える