2

KnockoutJSマッピングのドキュメントに基づくと、私がやろうとしていることは本当に簡単に思えますが、期待した結果が得られていません。

したがって、いくつかの簡単なテストhtml-

<div data-bind="with: rootItem">
<p data-bind="text: subProperty"></p>
    <div data-bind="with: subObject">
        <p data-bind="text: subSubProperty"></p>
</div>

そしてこのシンプルなビューモデルとアプリケーション

var vm = function(){
this.rootItem = ko.observable();

this.loadData = function(data){

    //map the rootObject here
    ko.mapping.fromJS(data,{},this.rootItem());

    //this.rootItem is undefined
    console.log(this.rootItem());
 };


};
   //create new viewmodel
    var myVM = new vm();
   //create some dummy data with nested objects and properties
    var data = {
    subProperty: "Top Level Property",
    subObject: {
        subSubProperty:"Sub Level Property",
        },
    };
  //load the data
  myVM.loadData(data);
  //apply the vm
  ko.applyBindings(myVM);

したがって、vm.rootObjectが設定されることはありません。ko.mappingプラグインの動作について何かが足りませんか？

loadData関数のこの実装は、望ましい結果を取得しますが、余分なステップを追加します。

this.loadData = function(data){

    //map the rootObject here
     this.rootItem(ko.mapping.fromJS(data));

    //this.rootItem is an object with a nested object and observable properties
    console.log(this.rootItem());
 };

最初の方法が失敗するのはなぜですか？ドキュメントには、「ko.mapping.fromJSの3番目のパラメーターがターゲットを示している」と明確に記載されています。

これが何が起こっているかを示すフィドルです。

4

1 に答える 1

3

ドキュメントは正しい「ko.mapping.fromJSの3番目のパラメーターはターゲットを示します。」. しかし、あなたは間違ったターゲットを提供しています:

を呼び出すko.mapping.fromJS(data,{}, this.rootItem());とthis.rootItemが初期化されるundefinedため、マッピング プラグインはそれをターゲットとして使用できません。

を作成するときに空のオブジェクトを使用するrootItemと、正常に機能します。

var vm = function(){
    this.rootItem = ko.observable({});

    this.loadData = function(data){     
        ko.mapping.fromJS(data,{}, this.rootItem());             
     };
};

JSFiddleのデモ。

于 2013-01-25T05:54:20.097 に答える