給定data-template-name的匹配模板名稱是什么

Question

我正在使用grunt-ember-templates預編譯我的模板 。 正如預期的那樣，這個工具將我的模板放在Ember.TEMPLATES數組中。 我很好地調整了grunt-ember-templates的配置。 為此，我想知道Ember.TEMPLATES數組中的預期鍵是什么。 假設我有這個模板：

<script type="text/x-handlebars" data-template-name="phones/index">
    ....
</script>

目前我在一個名為app/templates/phones_index.hbs的文件中有這個模板，而grunt-ember-templates正在將預編譯的模板放在Ember.TEMPLATES["app/templates/phones_index"] ，但這是錯誤的。

data-template-name="phones/index"的預期密鑰是什么？

Answer 1

在您的示例中， Ember.TEMPLATES的鍵應為“phones / index”。

您可以配置grunt-ember-templates以刪除路徑的第一部分，並將所有內容保留在app/templates/ ，假設您將模板放在文件app/templates/phones/index.hbs ，這將為您提供正確的密鑰。 使用此設置， app/templates/phones/index.hbs文件的密鑰將為Ember.TEMPLATES['phones/index'] ，這與具有data-template-name="phones/index"的未編譯<script>標記相同data-template-name="phones/index" 。

Gruntfile.js（與此項目中的Gruntfile.js相同）：

ember_templates: {
  options: {
    templateName: function(sourceFile) {
      return sourceFile.replace(/app\/templates\//, '');
    }
  },
  'dependencies/compiled/templates.js': ["app/templates/**/*.hbs"]
},