knockout - 配列のオブジェクトを持つビューを更新する必要があります

Question

私はオブジェクトの配列を持っています。オブジェクトのそれぞれは、表示したい特定のモーダルの要素を定義しています。 そうです。

var data = [{view1:"hello", view2:"world"}]; 

var viewModel = { 
    currentView: ko.observable({}) // are objects observable? 
}; 

モーダルをロードすると、オブジェクトが配列から取り出されます。

var getDataForView = function (id) { 
     var result = data.filter(function (obj) { 
      return obj.Id == id; 
     }); 
     return result; 
    }; 

次に、そのオブジェクトを現在のビューとしてロードします。

var singleViewData = getDataForView(id); 
viewModel.currentView(singleViewData); 

オブジェクトは更新されていないようですか？私は別の意見を呼び出すとき。私はここで間違って何をしています、これを行う正しい方法は何ですか？

Answer 1

getDataForViewは配列を返します。また、入力したテストデータには、Idプロパティを持つオブジェクトは含まれていません。

あなたはこれらの問題を修正する場合、期待どおり、すべての作品：お使いのブラウザのサポートで許可されていればあなたもArray.prototype.findを使用することができ

var data = [{ 
 
    view1: "hello", 
 
    Id: 0 
 
}, { 
 
    view2: "world", 
 
    Id: 1 
 
}]; 
 

 
var viewModel = { 
 
    currentView: ko.observable({}) // are objects observable? 
 
}; 
 

 
var getDataForView = function(id) { 
 
    var result = data.filter(function(obj) { 
 
    return obj.Id == id; 
 
    }); 
 
    return result; 
 
}; 
 

 
ko.applyBindings(viewModel); 
 

 
var singleViewData = getDataForView(0)[0]; 
 
viewModel.currentView(singleViewData);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<div data-bind="with: currentView"> 
 
    <pre data-bind="text: JSON.stringify($data, null, 2)"> 
 

 
</pre> 
 

 
</div>

代わりの.filter()[0]。

Answer 2

私はあなたの質問は、あなたの意見は、それらの内部値を更新していない理由についてであると考えて計算さ

var data = [{view1:"hello", view2:"world"}]; 

var viewModel = { 
    views  : ko.observable(data), 
    currentId : ko.observable('view1') 
}; 
viewModel.currentView = ko.computed(function(){ 
    var cid = viewModel.currentId(); 
    var views = viewModel.views(); 
    if(views.hasOwnProperty(cid)){ 
     return views[cid]; 
    } else { 
     return ""; 
    } 
}); 

Answer 3

を使用します。なぜなら、currentViewが観測可能である一方で、その内部に含まれるデータはであり、が観測可能であるからです。値 'hello'と 'world'を更新したい場合は、を観測する必要があります。私はあなたの例はやや不自然であり、あなたがあなたのデータにIDを持っていないという確信している - しかし、あなたの質問への答えはこれです：あなたは値を更新する場合

• それは、観察する必要がありますかそれは更新されません。これは個々のプロパティを意味し、オブジェクトが属するオブジェクトだけではありません。

var data = [{ id: 123, view: ko.observable("hello") }, 
 
      { id: 456, view: ko.observable("world") }]; 
 

 
var ViewModel = function() { 
 
    var self = this; 
 
    self.currentView = ko.observable() // anything can be observable 
 
}; 
 

 
var getDataForView = function(id) { 
 
    var result = data.filter(function(obj) { 
 
     return obj.id == id; 
 
    }); 
 
    if (result.length === 0) 
 
     return; 
 
    return result[0].view(); 
 
    }; 
 

 
var vm = new ViewModel(); 
 
vm.currentView(getDataForView(456)); 
 
ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<input type="text" data-bind="textInput: currentView"/> 
 
<br/> 
 
<br/> 
 
Current view: <b data-bind="text: currentView"></b>