Javascript RequireJS文本插件和变量连接字符串

Javascript RequireJS文本插件和变量连接字符串,javascript,requirejs,amd,Javascript,Requirejs,Amd,我正在使用RequireJS文本插件加载一些html模板。 当我将字符串文本传递给require函数时,它可以正常工作 var templateHTML = require('text!templates/template_name.html'); 但是当我使用变量连接字符串时 var templateName = 'template_name'; var templateHTML = require('text!templates/'+templateName+'.html'); 它抛出以

我正在使用RequireJS文本插件加载一些html模板。 当我将字符串文本传递给require函数时,它可以正常工作

var templateHTML = require('text!templates/template_name.html');
但是当我使用变量连接字符串时

var templateName = 'template_name';
var templateHTML = require('text!templates/'+templateName+'.html');
它抛出以下错误:

Uncaught Error: Module name "text!templates/template_name.html" has not been loaded yet for context: _
对这个问题有什么想法吗

更新:这是我的测试代码

require.config({
    paths: {
       text: '../lib/text',
    }
});

define(function (require, exports, module) {
   "use strict";
    require(['text'], function (text) {

       //var templateHTML = require('text!templates/template_name.html');

       var templateName = 'template_name';
       var templateHTML = require('text!templates/'+templateName+'.html');


    });
});
RequireJS文本版本:2.0.3

RequireJS版本:2.1.1

您尝试过这种方法吗

require.config({
  paths: {
    text: '../lib/text',
  }
});

define(function (require, exports, module) {
  "use strict";
   var templateName = 'template_name';

   require(['text!templates/' + templateName + '.html'], function (template) {
      console.log('loaded template: ', template);
   });
});

只是一个想法,告诉我它是如何运行的。

定义数组中的路径,确保在使用它之前加载它

var templateName = 'template_name';
require(['text!templates/'+templateName+'.html'], templateHTML);

//now you can use  
this.template =  _.template(templateHTML, {});

require中的依赖项扫描仅适用于字符串文本依赖项。您应该查看require.js源代码,并尝试查找cjsRequireRegExp变量。 正如前面提到的,您可以使用回调符号加载内容

cjsRequireRegExp = /[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g

我在尝试使用主干线/木偶时也遇到了这个问题。感谢以上@Ignacio和@Stanislau Tsishkou的洞察力

我能够使用数组+回调的方法解决它:

var templateName = 'template_name';
var templateHTML = require('text!templates/'+templateName+'.html', function (templateHTML) {
  templateHTML = template;
);

// ...

var View = Backbone.Marionette.ItemView.extend({
  // ...

  template: function() { 
    return Handlebars.compile(templateHTML).apply(null, arguments); 
  },

  // ...
});
重要的部分是:

  • 确保将回调中返回的结果templateHTML设置为在适当范围内可访问的变量(templateHTML=template就是实现这一点的方法)
  • 如果使用木偶,请确保使用函数生成模板,因为这不会在实际需要模板之前尝试呈现模板HTML
  • 如果像我在本例中一样使用Handlebar,请确保使用apply方法,因为我必须将模板函数中使用的任何参数传递给它,因为Handlebar.compile()返回的是一个函数,而不是编译后的模板文本
  • 如果您不使用把手,仅使用下划线或Lodash,木偶文档提供了一个很好的示例-

    template : function(serialized_model) {
      var name = serialized_model.name;
      return _.template(templateHTML)({
        name : name
      });
    }