Spa*_*kle 12 knockout-2.0 knockout.js
我试图建立一个网格并通过JSON用更多记录更新它.在这个简单的例子中,我能够实现所需的功能,但我只能更新/推送一个JSON记录.我希望能够通过JSON添加多个记录?我怎么能实现这个目标?我假设我可能必须创建某种for循环并将每个JSON结果推送到observable但我希望淘汰赛可能有更好的方法通过JSON更新/解析?
下面是迄今为止我所取得的成果:http://jsfiddle.net/sparkhill/crSbt/
function Users(user_id, password) {
this.user_id = ko.observable();
this.password = ko.observable();
}
var viewModel = {
users: ko.observableArray([]),
addUser: function () {
this.users.push({
user_id: "",
password: ""
});
},
addJSON: function () {
//Works Fine
var JSONdataFromServer
='{"user_id":"frances","password":"password"}';
//More than one result - wont map - Would Ideally like to map lots of records at one time
//var JSONdataFromServer ='{"user_id":"frances","password":"password"}, {"user_id":"frances","password":"password"}';
var dataFromServer = ko.utils.parseJson(JSONdataFromServer);
this.users.push(dataFromServer);
//Tried
//this.users.push(JSON.parse(JSONdataFromServer));
}
};
viewModel.users();
ko.applyBindings(viewModel);
</script>
Run Code Online (Sandbox Code Playgroud)
更新这似乎工作,但我想知道他们是否是一个更有效的方法?
addJSON: function () {
//Works Fine
var JSONdataFromServer
='[{"user_id":"frances","password":"password"},{"user_id":"timmy","password":"password"}]';
var results = JSON.parse(JSONdataFromServer);
var i = results.length;
for(var i = 0; i < results.length; i++){
this.users.push(results[i]);
};
Run Code Online (Sandbox Code Playgroud)
Joh*_*apa 22
这里有3种方法可以做到这一点......在这个小提琴中找到:http://jsfiddle.net/johnpapa/nfnbD/
1)使用ko.utils.arrayPushAll函数2)使用自己的逻辑3)在observableArray上编写自己的函数
细节 ...
1)如果你使用ko.utils.arrayPushAll函数,你也需要调用valueHasMutated,因为数组有效地被自己覆盖.可观察性并没有触发你告诉它改变的unles.这是你如何做到这一点:
ko.utils.arrayPushAll(this.users(), dataFromServer);
this.users.valueHasMutated();
Run Code Online (Sandbox Code Playgroud)
2)第二个选项是编写自己的循环逻辑,基本上使用与arrayPushAll函数相同的代码.
for (var i = 0, j = dataFromServer.length; i < j; i++)
this.users.push(dataFromServer[i]);
Run Code Online (Sandbox Code Playgroud)
3)在observableArray上创建自己的函数,如下所示:
ko.observableArray.fn.pushAll = function(valuesToPush) {
var items = this;
for (var i = 0, j = valuesToPush.length; i < j; i++){
items.push(valuesToPush[i]);
}
return items;
};
Run Code Online (Sandbox Code Playgroud)
虽然上面的代码会在每次添加项目时通知.所以最好将它们全部添加,然后通知.这会更有效率.像这样:
ko.observableArray.fn.pushAll = function(valuesToPush) {
var underlyingArray = this();
this.valueWillMutate();
ko.utils.arrayPushAll(underlyingArray, valuesToPush);
this.valueHasMutated();
return this;
};
Run Code Online (Sandbox Code Playgroud)
然后像这样称呼它:
this.users.pushAll(dataFromServer);
Run Code Online (Sandbox Code Playgroud)