javascript - Marionette.js 动态更改模板，requireJS 不起作用

Question

这是我的代码:

    render: function () {
        var data = this.serializeData(),
            that = this;
        require(['text!trigger-menu/confirmation/' + that.model.get('type') + '-template.html'],
            function(templateHTML) {
               var html = _.template(templateHTML, data);
               that.$el.html(html);
        });
    }

我有 3 个可以显示的不同确认 View 。 3 个中的 2 个正在工作。不是的看起来像这样:

<ul>
    <% _.each(signupForms, function (signup) { %>
        <li><%- signup.name %></li>
    <% }); %>
    <% _.each(authorizedApps, function (app) { %>
        <li><%- app.name %></li>
    <% }); %>

    <% if ((!signupForms && !authorizedApps) || (!signupForms.length && !authorizedApps.length)) { %>
        <li>All signups</li>
    <% } %>
</ul>

错误是Uncaught NotFoundError:无法在“Node”上执行“appendChild”:新的子元素为空。

还有其他人遇到此错误吗？

Answer 1

您可以在初始化 View 时执行此操作，而不是在渲染函数中更改模板:

define([
    'jquery',
    'underscore',
    'backbone',
    'marionette',
    'text!templates/template1.html',
    'text!templates/template2.html',
], function ($, _, Backbone, Marionette, template1, template2) {
    var View = Backbone.Marionette.ItemView.extend({
        initialize: function () {
            if({YourConditionHere}){
this.template = Marionette.TemplateCache.get(template1);
        }else{
this.template = Marionette.TemplateCache.get(template2);
    });
    // Our module now returns our view
    return View ;
});