我遇到一个问题,即 UI 仅在刷新页面后更新正确的数据。我从这里来observableArray is not defined
我的 JS 代码:
define(
['knockout'],
function (ko) {
"use strict";
return {
onLoad: function (widget) {
widget.getDetails= function (prod) {
var abc = prod.DetailsNumbers();
console.log(abc);
var someArray= [];
someArray= abc.split(',');
//console.log(someArray);
widget.anotherObservableArray = ko.observableArray();
for (var i = 0; i < someArray.length; i++) {
var temp = {
"prodName": ko.observable(someArray[i])
};
var myKoObservableArray = widget.anotherObservableArray;
myKoObservableArray.push(temp);
}
console.log(myKoObservableArray());
this.myKoObservableArray = myKoObservableArray;
};
}
}
}
);
我的 HTML:
<div id="someId">
<table>
<tbody>
<tr>
<td>Button Here</td>
<td><button data-bind="click: getDetails(product())">Click me</button></td>
</tr>// this here is working fine
</tbody>
</table>
<ul data-bind="foreach: myKoObservableArray">
<li>
<span data-bind="text: prodName"> </span> //this changes only after a refresh
</li>
</ul>
</div>
data-bind="text: prodName"
仅在刷新页面后更改值。
最佳答案
在 onLoad 中创建数组一次,然后更新它。不要每次都创建它。
define(
['knockout'],
function (ko) {
"use strict";
return {
onLoad: function (widget) {
widget.myKoObservableArray = ko.observableArray();
widget.getDetails= function (prod) {
var abc = prod.DetailsNumbers();
console.log(abc);
var someArray= [];
someArray= abc.split(',');
//console.log(someArray);
// empty the array
widget.myKoObservableArray([]);
for (var i = 0; i < someArray.length; i++) {
var temp = {
"prodName": ko.observable(someArray[i])
};
widget.myKoObservableArray.push(temp);
}
console.log(widget.myKoObservableArray());
};
}
}
}
);
关于javascript - observableArray 不更新 UI,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36434173/