1

我正在努力了解如何使用 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();

非常感谢通过视图模型的逻辑分离来构建它的任何帮助。

4

1 回答 1

0

完整示例站点: https ://github.com/maxfridbe/WindowKO-TS-JS/tree/master/CleanWeb

基本上淘汰寻呼机和打字稿

我用我自己的 makepage 绑定包装页面:makepage(),它采用基于声明式约定的结构:即 makepage('bob') 具有这种结构

将放置一个 !#/bob

/area folder

    /views folder

   /view models folder
于 2014-08-23T13:01:57.217 回答