var subject = function (data) {
self = this;
self.subjectName = ko.observable(data ? data.subjectName : "");
self.subjectPassPercentage = ko.observable(data ? data.subjectPassPercentage : "");
}
var course=function(data){
self = this;
self.courseName = ko.observable(data ? data.courseName : "");
self.subjectList = ko.observableArray([]);
}
查看模态
app.viewmodal = (function (ko) {
"use strict";
var me = {
subjectObject: ko.observableArray([]),// Array of subject
course: ko.observableArray([])// Array of course
}
return me;
})(ko);
单击时,我正在执行以下代码
me.course()[0].subjectList().push(me.subjectObject()[0]);
在 HTML 中,我试图打印计数
<div data-bind="text:viewmodal.course()[0].subjectList().length"></div>
但是数组 subjectList 中的更改并未反映在 UI 中。它总是显示0。
但是当我点击下面的 div 时,它会在控制台日志中给出正确的计数。
<div data-bind="click: function(){ console.log(viewmodal.course()[0].subjectList().length)}">Click Me</div>
请帮助我确定问题并向我建议解决方案。
这里的问题似乎是代码:
me.course()[0].subjectList().push(me.subjectObject()[0]);
.subjectList().push(...)
在 observable 中调用unwraps 数组并将对象直接推入其中 - 通过这样做,您将绕过所有 ko 机制。文档说:
pop、push、shift、unshift、reverse、sort、splice所有这些函数都相当于在底层数组上运行原生的 JavaScript 数组函数,然后通知监听器这个变化
因此,要解决此问题,您只需要push
在像这样调用observableArray时删除括号:
me.course()[0].subjectList.push(me.subjectObject()[0]);
这将通知 ko 关于您的更改和 UI 应该更新
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句