3

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

4

4 に答える 4

1

配列内のパスを定義して、使用する前にパスがロードされることを確認します

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

//now you can use  
this.template =  _.template(templateHTML, {});
于 2013-01-07T11:03:03.963 に答える
0

このように試しましたか？

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);
   });
});

ただのアイデア、それがどうなるか教えてください。

于 2013-01-07T10:58:33.323 に答える
0

require内の依存関係スキャンは、文字列リテラルの依存関係でのみ機能します。require.jsソースを調べて、cjsRequireRegExp変数を見つけてください。前に述べたように、コールバック表記を使用してコンテンツをロードできます。

cjsRequireRegExp = /[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g
于 2015-07-29T14:10:33.633 に答える
0

Backbone / Marionetteを使用しようとしたときにも、この問題が発生しました。上記の@Ignacioと@StanislauTsishkouの洞察に感謝します。

配列+コールバックアプローチを使用してそれを解決することができました：

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); 
  },

  // ...
});

重要な部分は次のとおりです。

  1. コールバックで返される結果のtemplateHTMLを、適切なスコープでアクセス可能な変数に設定していることを確認してください（templateHTML = templateがこれを実現します）。
  2. Marionetteを使用している場合は、関数を使用してテンプレートを生成していることを確認してください。これは、実際に必要になる前にtemplateHTMLをレンダリングしようとしないためです。
  3. この例のようにハンドルバーを使用する場合は、必ずapplyメソッドを使用してください。Handlebars.compile（）はコンパイルされたテンプレートテキストではなく関数を返すため、テンプレート関数で使用される引数を渡す必要があります。

アンダースコアまたはLodashのみのハンドルバーを使用していない場合は、マリオネットのドキュメントに良い例が示されています-http: //marionettejs.com/docs/v2.4.2/marionette.itemview.html#itemview-render

template : function(serialized_model) {
  var name = serialized_model.name;
  return _.template(templateHTML)({
    name : name
  });
}
于 2015-09-18T18:09:57.913 に答える