requirejs 加载异步模板模块模式

Question

我刚决定第一次尝试 require.js，而且在大多数情况下，它运行良好 - 直到我尝试动态处理模板加载。

基本上，我有一个要求，即在模板全部加载并可用之前，应用程序不应继续运行。

为此，我们创建了一个“模板”模块。它导入一个模板数组的定义（已经可用），它需要加载 - 要求 - 在它返回之前。

我很确定这可能是一种反模式，那么您将如何解决它？

app -> requires "templating"
    define templating ->
        - loop through an array of templates and dynamically create a list
        - define all templates (via text!) so later we can require("template-name")
        - also tried, require all templates 

我观察到模板模块在加载所有模板之前加载并可供应用程序使用。

随后是 XHR 获取模板。

如何防止模块在所有文本加载和编译之前返回？伪代码或示例链接会很好。

Answer 1

实际上，我们在项目早期有一个解决方案，然后转移到另一个解决方案。

[1] 同步 - 因为我们在我们的应用程序中使用 jQuery，所以我们可以在整个应用程序中使用 jQuery Deferred 对象。我创建了一个 Deferred 实例，它仅在加载所有模板时才调用它的 .resolved() 。然后，每次我尝试使用模板时，我都会将其包裹在如下代码中：

$.when(cache.templatesLoadedPromise).done(
  function () {
    // Render the view.
    $("...").html($.tmpl(cache.template, jsonData));
  });

然后在模板可用之前不会进行任何渲染。

[2] 每个模块加载和注册 - 没有人对解决方案 [1] 如此疯狂，我们希望每个模块仅加载该特定模块所需的模板。所以我们开始只是将它们列为“text！something.tmpl”需求，然后将该特定模板注册为模块中具有该需求的第一行。在我们的例子中，我们使用 Handlebars 作为模板引擎和 ICanHandlebarz（类似于 ICanHaz for Mustache）。所以我打电话给 ich.addTemplate("something", something);在模块代码的开头。

在少数情况下，多个模块使用相同的模板，所以我必须在注册之前测试模板是否已经注册。

我希望其中之一能帮助您解决问题。