从视图中引用 observableArray 对象属性。

Question

当我尝试根据 observableArray 中的特定对象属性设置按钮的可见性时，Knockout.JS 出现问题。在我看来绑定的对象是这个：

function IncomeDeclarationHub() {
        var self = this;
        //Other properties
        self.IncomeDeclarationViewModel = ko.observableArray();
 }

当然这是用来填充 observableArray:

的对象

function IncomeDeclarationViewModel(data) {
        var self = this;
        //Other properties
        self.IsSent = ko.observable(data.IsSent);
}

有时我用数据填充 IncomeDeclarationViewModel，它工作正常。问题是，只有当 observableArray 的第一个元素中的属性 IsSent 为真时，我才需要显示一个按钮。所以我尝试了很多事情，比如：

<input type="image" data-bind="visible: IncomeDeclarationViewModel()[0].IsSent()" />

同时更改我为 visible: IncomeDeclarationViewModel[0].IsSent() 或 visible: IncomeDeclarationViewModel()[0].IsSent 提供参考的位置。

但我不断收到此错误：

Uncaught Error: Unable to parse bindings.
Message: TypeError: Cannot read property 'IsSent' of undefined;
Bindings value: click: Print, visible: myIncomeDeclarationViewModel()[0].IsSent()

我遗漏了什么或哪里错了？

Answer 1

我认为这是因为在某些时候未填充 IncomeDeclarationViewModel 导致错误，因为如果数组为空，第一个元素中将没有对象。

更改对此的绑定以检查数组中是否有元素：

<input type="image" data-bind="visible: IncomeDeclarationViewModel().length > 0 && IncomeDeclarationViewModel()[0].IsSent()" />

另一种方法是使用 with 绑定，只有在 IncomeDeclarationViewModel 的第一项中有对象时，任何子绑定才会显示和执行：

<div data-bind="with: IncomeDeclarationViewModel()[0]">
    <input type="image" data-bind="visible: IsSent" />
</div>

从视图中引用 observableArray 对象属性。

Referencing observableArray object property from view.

javascript

knockout.js

从视图中引用 observableArray 对象 属性。

Referencing observableArray object property from view.

javascript

knockout.js

从视图中引用 observableArray 对象属性。