带有延迟绑定的Pager.js

Question

我正在尝试使用Pager.js创建一个页面应用程序。我的结构如下：

#word/definition
#word/example
#word/synonym

因此，definition、example等是具有page绑定的div：

<div data-bind="page: {id: 'word'}">
  <div data-bind="page: {id: 'definition'}">
    <-- stuff goes here -->
  <div data-bind="page: {id: 'example'}">
    <-- stuff goes here -->

诸若此类。

现在，碰巧的是，每个单词对于所有路由都有一个ViewModel，它由一个JSON服务器处理程序提供：

{ definition: "A blah blah blah"
, example: "Don't mess with Texas"
, synonym: "fubar"
}

如何加载ViewModel，使三条路由“共享”它？

<div data-bind="page: {id: 'word', withOnShow: getJsonWord}>
  <div data-bind="page: {id: 'definition'}">
    <-- stuff goes here -->
  <div data-bind="page: {id: 'example'}">
    <-- stuff goes here -->

其中，getJsonWord是一个访问服务器并使用JSON的函数。它被触发，我看到一个JSON响应。但是当我像这样构造页面时，所有的子div总是可见的。寻呼机不会在他们之间切换。

Answer 1

我猜您当前的getJsonWord正在执行jQuery异步ajax调用，这意味着最终的JSON不会直接从函数调用中返回。

您需要包装ajax对pager.js的调用，以注入回调。

vm构造函数中的Javascript

your_root_vm.getJsonWord = function(callback) {
  $.getJSON(your_url, function(data) { callback(data); });
};

对于你提到的所有视图都是可见的另一个问题，如果可能的话，请提供一个小提琴。