【问题标题】:knockout with requirejs and underscore to get external templating用 requirejs 和下划线淘汰以获取外部模板
【发布时间】:2012-11-19 07:25:02
【问题描述】:

我正在尝试使用敲除、要求、下划线构建一个小型应用程序。

我有我的索引页面,我在其中调用 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

});

调用homeview模板。

谢谢

【问题讨论】:

    标签: knockout.js underscore.js


    【解决方案1】:

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

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

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

    【讨论】:

    • 非常有趣的文章。如果你能在 github 上放一个这样的代码示例,那就太好了。
    • 我也在尝试将它与 jQueryMobile 一起使用 - 所以我想当链接更改时我将不得不触发一个事件。在主干中我会关闭路由然后使用主干路由器..您是否建议在这里做类似的事情,因为我需要知道何时加载另一个页面模板..
    • 是的。这可能是最好的计划。 KnockoutJS 没有附带路由器,但实现第三部分并不难。我对 jQuery mobile 没有太多经验,但它应该可以工作。
    • 就您对代码示例的看法而言,我打算在有机会时通过示例对此进行更彻底的撰写。我可能最终会在我的博客上发布它:mberkompas.com
    • 我已经实现了你的想法,但我遇到了一些问题。你能看看这个吗? stackoverflow.com/questions/13469143/… 主要问题是附加正文需要时间,这意味着测试应用有时显示不正确
    猜你喜欢
    • 1970-01-01
    • 2019-04-17
    • 2015-04-17
    • 2012-11-09
    • 1970-01-01
    • 2014-01-02
    • 2012-11-18
    • 2015-09-16
    • 1970-01-01
    相关资源
    最近更新 更多