Knockout,Require,Sammy和每个页面的视图模型 - 我如何使其工作?

时间:2013-07-21 09:09:47

标签: javascript knockout.js requirejs sammy.js

我有一个KO应用程序,我的每个页面都有一个单独的视图模型,可以处理该页面上所需的所有操作(加载,添加,编辑,删除等)。我已经设法使用RequireJS将代码拆分为多个模块,但我找不到使用Sammy一次使多个视图模型工作的方法。

这是我目前在init.js文件中设置的设置,它会在第一页上加载内容。它有效:

require(['jquery', 'ko', 'sammy', 'viewmodels/page1'], function($, ko, sammy, page1) {
  var page1VM = new page1.ViewModel();
  ko.applyBindings(page1VM);

  var app = sammy('#wrapper', function() {
    this.get('#page1', function() {
      page1VM.loadContent();
    });

    this.get('#page2', function() {
      // do nothing yet
    });

    [...]

    this.get('#pageX', function() {
      // do nothing yet
    });
  });

  app.run('#page1');
});

如何将其他视图模型绑定到其他页面?

我还尝试为ko.applyBindings中的每个页面添加一个单独的this.get,当我切换回已经应用了这些绑定的页面时,会出错。

1 个答案:

答案 0 :(得分:2)

http://jsfiddle.net/PgLgz/4/

好吧我回到小提琴并清理了所有代码,以便有效地向我展示我的回答 -

function myViewModel() {
    var self = this;
    self.message = "hey";
    self.page1VM = new page1VM();
    self.page2VM = new page2VM();
    var app = sammy('#wrapper', function() {
        this.get('#page1', function() {
            page1VM .loadContent();
        });
    });
};

ko.applyBindings(new myViewModel());

请记住,虽然在小提琴中我无法真正使用Sammy.js(我不会改变视图或导航)并且基本上没有理由使用Require.js,因为它只是一个例子,我把所有的视图模型在同一个JS文件中。

由于您使用的是Sammy并且需要,您需要使用此代码并将其功能性地应用到您的网站或在某处发布更多代码。