Angular 外部模板与 Handlebars 外部模板

Question

这就是我在 Handlebarsjs 中加载和编译模板的方式，

define([
    'jquery',
    'handlebars'
],
function ($, Handlebars) {

    // @reference: http://berzniz.com/post/24743062344/handling-handlebars-js-like-a-pro
    Handlebars.getTemplate = function(name) {
        if (Handlebars.templates === undefined || Handlebars.templates[name] === undefined) {
            $.ajax({
                url : 'js/template/' + name + '.handlebars',
                success : function(data) {
                    if (Handlebars.templates === undefined) {
                        Handlebars.templates = {};
                    }
                    Handlebars.templates[name] = Handlebars.compile(data);
                },
                dataType: "text",
                async : false
            });
        }
        return Handlebars.templates[name];
    };

    // Precompile your templates and add/paste them below here. 

});

我可以用下面的这一行检索模板，

this.$el.html(Handlebars.getTemplate('list')({contacts: response}));

这样我就不必一遍又一遍地使用 ajax 调用同一个模板。我可以从 Handlebars 的存储中获取它。

Angularjs 可以做到这一点吗？我一直在寻找在 Angualrjs 中执行此操作的教程，但找不到任何教程。有什么好的开始吗？

Answer 1

Angular.js 在请求模板时缓存模板（因此请求只发生一次），但您可以使用 $templateCache 预填充该缓存。