は、私はシンプルなノックアウトのviewmodel持っJavascriptとノックアウト

Question

で、それは空を返します。

function HumanViewModel(humanViewModel) { 
    if (humanViewModel=== undefined || humanViewModel=== null) { 
    humanViewModel= {}; 
    } 

    var self = this; 

    var Id = humanViewModel.Id || ''; 
    var Name = humanViewModel.Name || ''; 
} 

私はこのモデルを埋めるために、サーバーからいくつかのJSONデータを取得していますが、ここでの成功に何が起こっているかです。

var result = []; 
     for (var i = 0; i < receivedData.length; i++) { 
     var vm = new HumanViewModel({ Id: receivedData[i].Id, Name: receivedData[i].Name }); 
     result.push(vm); 
     } 
     self.Humans.push.apply(self.Humans, result); 

問題はここにあります：var vm = new HumanViewModel({ Id: receivedData[i].Id, Name: receivedData[i].Name });。変数vmにはHumanViewModelが含まれていますが、このビューモデルにはIdとNameは含まれていません。

しかし、私がデバッガを見ているときには、HumanViewModelの内部はすべて正常に動作しますが、最後にはvmには何も含まれていません。

データが失われた場所はわかりません。どうすればこの問題を解決できますか？

Answer 1

IDと名前を変数に格納する代わりに、関数コンテキストに保存する必要があります。

次のコードは動作するはずです：

function HumanViewModel(humanViewModel) { 
    if (humanViewModel=== undefined || humanViewModel=== null) { 
    humanViewModel= {}; 
    } 

    var self = this; 

    this.Id = humanViewModel.Id || ''; 
    this.Name = humanViewModel.Name || ''; 
} 

あなたがnew HumanViewModelを呼び出すたび、あなたはあなたがこの範囲にHumanViewModelを指しthisを使用して、それらを設定するためHumanViewModelはIDと名前を望むでしょう。

Answer 2

var self = thisを定義すると、作成するインスタンスを参照する値thisにすぐにアクセスできます。

selfは、オリジナルのthis値がオブジェクト内で維持されていることを確認するために使用されています。たとえば、計算された観測値を持つ場合、適切な値のthisにバインドすることができます。したがって、オブジェクト内のselfにこれを割り当てると、self.Id = ...を使用できます。

例：https://jsfiddle.net/kyr6w2x3/135/

var data = [{ Id: 1, Name: "Name 1" },{ Id: 2, Name: "Name 2" },{ Id: 3, Name: "Name 3" } ]; 

function MainViewModel(){ 
    var self = this; 
    self.Humans = ko.observableArray([]); 

    //on success 
    self.Humans($.map(data, function (item) { 
    return new HumanViewModel(item); 
    })); 
} 

function HumanViewModel(data) { 
    var self = this; 
    self.Id = ko.observable(data.Id); 
    self.Name = ko.observable(data.Name); 
} 

var viewModel = new MainViewModel(); 
ko.applyBindings(viewModel);