Javascript 将敲除可观察数组绑定到多个<；ul>；元素

对于导航菜单，我有两组链接，每组和链接是否显示取决于用户的角色。在构建链接结构并相应地构建链接列表时，将查找角色。返回的JSON被解析，放入可观察数组中，没有问题，但当我实际尝试应用绑定时，绑定失败，因为可观察对象为空。这是HTML

<ul id="user-menu" class="menu" data-bind="foreach: areas">
    <li>
        <a data-bind="attr: { href: areaLink }">
            <img data-bind="attr: { src: iconUri }" />
            <span data-bind="text: areaName"></span>
        </a>
    </li>
</ul>
<ul id="admin-menu" class="menu" data-bind="foreach: adminAreas">
    <li>
        <a data-bind="attr: { href: areaLink }">
            <img data-bind="attr: { src: iconUri }" />
            <span data-bind="text: areaName"></span>
        </a>
    </li>
</ul>

因此，在我取回JSON后，解析它，并在循环使用

$.getJSON

方法的success函数时对其进行组织，在

self.areas（）

和

self.adminAreas（）

上放置一个手表，以显示数组具有我想要的确切信息。但在必须应用它们时，调用

vmInstance.areas（）.length

或

vmInstance.adminAreas（）.length

返回零。更奇怪的是，在

$.getJSON

调用之后，但在

setup（）

函数中，输入一个带有数组长度的警报将导致警报首先触发，显示零，然后通过get，填充数组，然后再次触发零

不太清楚这里发生了什么，但我不记得在另一个项目中看到过这种行为，所以我不太确定我在这里做错了什么。如有任何想法或建议，将不胜感激

---

编辑：不要在小提琴上弹奏。它实际上没有捕获我的实际错误。

adminarea对象未初始化。您创建了adminarea变量，但使用了相同的区域变量来设置值

    var adminArea = new Area();

    adminArea.areaName('test admin area'); 
    adminArea.areaLink('#');
    adminArea.iconUri('http://evernote.com/media/img/getting_started/skitch/windows8/win8-checkmark_icon.png');
    adminArea.sequenceNo(1);
    adminArea.isAdmin(true); 

---

而且您不需要调用applyBinding两次。applyBindings（vm）可以满足您的所有需求。谢谢你的更正：）我已经更新了提琴。别管提琴了。事实证明，这不是我真正的问题。相反，真正的问题是我的数组在被AJAX调用填充和被绑定调用之间以某种方式清空。请看更新后的问题。代码是有效的，所以我认为这是ajax调用的问题，因为它是异步调用，所以在响应可用之前绑定完成。尝试在firebug中调试。这是可能的，但我已经在其他项目中使用了基本相同类型的代码。无论如何，当异步调用到来时，绑定应该得到更新，我看到它正在Chrome开发者工具中尝试。在用完所有其他选项后，我崩溃了，使用了

$.ajax

调用

async:false

，这确实有帮助。当我尝试相同的方法时，我认为它在其他几次都有效，因为类型是一个

GET

，尽管我不能100%确定这就是为什么我想先排除任何其他内容。如果是时间问题（即Ajax返回发生在applyBindings调用期间），您可以移动

vmInstance.setup（）

在applyBindings调用后调用。然后，它们将被呈现为空，但在添加数据时会重新呈现。在applybinding之后，getJSON异步加载数据并不重要，ko知道要更新视图，因为area和adminarea是可观察的。要进行调试，可以添加self.areas.subscribe（函数（v）{console.log（v）；}）；（也适用于adminAreas）以跟踪数据的更改。

    navigation.setup();

    var adminArea = new Area();

    adminArea.areaName('test admin area'); 
    adminArea.areaLink('#');
    adminArea.iconUri('http://evernote.com/media/img/getting_started/skitch/windows8/win8-checkmark_icon.png');
    adminArea.sequenceNo(1);
    adminArea.isAdmin(true);