第一次访问后,Pagerjs没有使用OnShow更新

时间:2013-08-24 13:38:31

标签: javascript knockout.js pagerjs

我正在使用Pager.js和withOnShow以通配符动态获取正确的数据。 它在您第一次访问页面时有效,但如果您导航到新的ID,则会返回正确的viewModel,但不会更新绑定。

HTML:

<div data-bind="page: {id: 'start'}">
    <a href=""  data-bind="page-href: '/11'">id 11</a>
    <a href=""  data-bind="page-href: '/12'">id 12</a>
</div>
<div data-bind="page: {id: '?', withOnShow: showView}">
    <h1 data-bind="text:id"></h1>
    <a href=""  data-bind="page-href: '/11'">id 11</a>
    <a href=""  data-bind="page-href: '/12'">id 12</a>
</div>

JS

vm = ko.mapping.fromJS({test: 1});
vm.showView = function(callback, page) {
    console.log(page.currentId);
    vm = ko.mapping.fromJS({id: page.currentId});
    callback(vm);
};
pager.useHTML5history = true;
pager.Href5.history = History;
pager.extendWithPage(vm);
ko.applyBindings(vm);
pager.startHistoryJs();

jsFiddle:http://jsfiddle.net/xU4Uu/

尝试导航到其中一个链接,然后使用新链接导航到另一个ID。控制台日志显示返回的正确ID,但h1未更新。

我是否使用此错误或者这是pager.js中的错误?我正处于一个项目的中间,我真的需要让它工作。有人解决了这个问题吗?

1 个答案:

答案 0 :(得分:1)

每次调用.showView时,您的代码都会重新创建viewmodel。您不应重新创建viewmodel,只能更新其属性。

变化:

vm = ko.mapping.fromJS({id: page.currentId});

为:

ko.mapping.fromJS({id: page.currentId}, vm);

ko.mapping.fromJS与VM一起用作第二个参数将使用新值更新VM成员(分别与第一个参数一起传递)。

更正小提琴:http://jsfiddle.net/xU4Uu/1/