淘汰赛可观察可见性不起作用答案

【问题标题】：Knockout observable visibility not working淘汰赛可观察可见性不起作用
【发布时间】：2014-03-18 02:22:23
【问题描述】：

简介：

我有一个简单的要求：根据 observable 的值显示或隐藏 2 个 div 中的 1 个。

我目前所拥有的：

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

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

在我的视图模型中，我有以下内容：

self.ActiveClientSideView = ko.observable();

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

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

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

我希望 div 像更新 ActiveClientSideView 的值一样轻松地显示/隐藏我错过了什么？

编辑（最新信息）：

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

【问题讨论】：

在这里查看调试技术stackoverflow.com/questions/9261296/…。特别是尝试将你的模型输出到文本框，看看你得到了什么。
好像ActiveClientSideView 是不可观察的，这使得绑定无法与其值同步。

标签： knockout.js

【解决方案1】：

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

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

更新

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

你在 ajax 调用中也有错误。你给ActiveClientSideView赋值不正确。

【讨论】：

我也认为是这样，我会用我的最新发现更新这个问题。但不，这不是解决方案。

【解决方案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'">

【讨论】：