Question

简介：

我有一个简单的要求：显示或隐藏2个div中的1个，具体取决于observable的值。

到目前为止我有什么：

让我们从html开始（非常简单的2个div - 当1可见时另一个隐藏）：

<div data-bind="visible: ActiveClientSideView == 'aValue'">
html content....
</div>
<div data-bind="visible: ActiveClientSideView != 'aValue'">
html content....
</div>

在我的viewmodel中，我有以下内容：

self.ActiveClientSideView = ko.observable();

在Ajax调用之后，值也会更新：

successError: function (result) {
 if (result.Code == "INVALID_ADDRESS") {
 alert("invalid address"); 
 self.ActiveClientSideView = "AddressRecommendations";
                         }

警报在那里检查代码是否正在触发，它是什么。

我期望div显示/隐藏就像更新 ActiveClientSideView 的值一样容易，我错过了什么？

编辑（最新信息）：

当页面最初加载时，我可以在init例程中设置observable的值，并且可见性正确调整，它在后续（后页加载事件）上，例如按钮点击，或稍后的可见性不动态调整。

Answer 1

您应该在ActiveClientSideView()绑定中使用ActiveClientSideView而不是visible：

<div data-bind="visible: ActiveClientSideView() == 'aValue'">
<div data-bind="visible: ActiveClientSideView() != 'aValue'">

<强>更新

我添加了jsfiddle演示。一切正常。

你也有ajax调用的bug。您错误地将值分配给ActiveClientSideView。

Answer 2

由于ActiveClientSideView是observable，而不是：

self.ActiveClientSideView = "AddressRecommendations";
// no longer an observable and Knockout cannot notify subscribers

你应该尝试：

self.ActiveClientSideView("AddressRecommendations"); 
// mutating the value using the observable function - notifying subscribers

另外（正如@Alexander所指出的那样），在检查observable值时，您应该首先调用该函数：

<div data-bind="visible: ActiveClientSideView() == 'aValue'">
<div data-bind="visible: ActiveClientSideView() != 'aValue'">

淘汰可观察的能见度不起作用

2 个答案: