使用requirejs和下划线进行淘汰以获得外部模板

时间:2012-11-19 07:25:02

标签: knockout.js underscore.js

我正在尝试使用knockout,require,underscore构建一个小应用程序。

我有我的索引页面,我在require中调用它指向一个main.js是我保留我的配置

require.config({

paths: {
    jquery:     'vendor/jqm/jquery_1.7_min',
    knockout: 'vendor/knockout/knockout-2.2.0',
    underscore : 'vendor/underscore/underscore_amd',
    text:       'vendor/require/text',
    templates:  '../templates'
}

});

define(['app'], function(app) {

});

我索引的其余部分没有正文。所以加载它时会调用app.js

define(['jquery','knockout', 'appViewModel'],
 function($, ko, appViewModel) 
{
    ko.applyBindings(new appViewModel());
});

这应该调用appViewModel,它可以正常工作。这是我有点困惑,因为我想从appViewModel加载模板

所以我试图做这样的事情

define(['jquery','knockout', 'text!templates/homeViewTemplate.html', 'jqm'],
function($, ko, homeViewTemplate) {

      //call and load in template

});

这是我在骨干中有点卡住的地方,例如我可以使用

  template:_.template(homeViewTemplate)

但我真的不确定在这里加载模板的最佳方法

我看过https://github.com/ifandelse/Knockout.js-External-Template-Engine但是这对于require并没有很好的效果,如果你在没有require的情况下使用它,只是在html文件中放入一些文本并在我使用jQuery mobile时调用它不会添加类等

我想知道是否有人可以指出我正确的方向..我想我真的想弄清楚要放在哪里的代码

    define(['jquery','knockout', 'text!templates/homeViewTemplate.html', 'jqm'],
function($, ko, homeViewTemplate) {

      //call and load in template

});

在homeviewtemplate中调用。

感谢

1 个答案:

答案 0 :(得分:2)

我使用jQuery将模板HTML插入页面,然后应用我的Knockout绑定。

$('#selector').append(homeViewTemplate);
ko.applyBindings(VIEWMODEL, $('#selector')[0]);

您可能也对我的WIP文章advanced knockout binding感兴趣。