我正在努力了解如何使用 pagerjs 和淘汰赛来正确构建我的应用程序。我希望在每个页面参考中包含单独的视图模型。
这是我的 index.html 示例中的 3 个页面:
<div data-bind="page: {
id: 'page_1',
title: 'page 1',
source: 'views/page1.html',
with: page1ViewModel
}">
</div>
<div data-bind="page: {
id: 'page_2',
title:'Page 2',
source: 'views/page2.html',
with: page2ViewModel
}">
</div>
<div data-bind="page: {
id: 'page_3',
title:'Page 3',
source: 'views/page3.html',
with: page3ViewModel
}">
</div>
所以我将我的页面 html 拆分到一个视图文件夹中,这很好用。我真正难以理解的是如何将我所有的视图模型存储在单独的文件中,以及它如何与 pagerjs 一起使用。
如果我只是在“main.js”中使用一个视图模型,它看起来像这样:
function viewModel() {
}
var viewModel = new viewModel();
// use #!/ instead of the default #
pager.Href.hash = '#!/';
// extend viewModel with a $__page__ that points to pager.page that points to a new Page
pager.extendWithPage(viewModel);
// apply your bindings
ko.applyBindings(viewModel);
// run this method - listening to hashchange
pager.start();
非常感谢通过视图模型的逻辑分离来构建它的任何帮助。