Javascript 余烬：相关模型出现在chrome Inspector中，但在模板中为空

我有以下代码成功加载了一件衣服。Chrome ember inspector显示服装及其相关模型都已加载，但我似乎无法在模板中显示相关模型（服装颜色）

非常感谢您的帮助

{log garment\u colors}}

记录一个空数组

类{类型：函数，内容：数组[0]，存储：类，{u changesToSync:OrderedSet，loadingrecordscont:0…}u成员1410723197678:“ember522”\u成员\元\对象\下一步：未定义\更改同步：OrderedSetcontent:array[0]isLoaded:trueisPolymorphic:UnfinedLoadingRecordsCount:0name:“garment_Color”所有者：Classstore:ClasstoString:function（）{return ret；}类型：App.GarmentColor_uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu

var attr = DS.attr,
    belongsTo = DS.belongsTo,
    hasMany = DS.hasMany;

App.Garment = DS.Model.extend({
    name: attr(),
    brand: attr(),
    description: attr(),
    materials: attr(),
    garment_colors: hasMany('garmentColor')
});

App.GarmentColor = DS.Model.extend({
  name: attr(),
  color: attr(),
  garment: belongsTo('garment')
});



App.DesignerRoute = Ember.Route.extend({
    model: function(params) {
        return this.store.find('garment',params.id);
    },
    setupController: function(controller, model) {
        controller.set('content', model)
        console.log(model);
    },
});


我的json

{
   "garment":{
      "id":2,
      "name":"Ultra shirt",
      "brand":"Gildan",
      "description":"this is the description",
      "materials":"5.6 oz. 50% preshrunk cotton, 50% polyester.",
      "garment_color_ids":[
         66,
         67,
         68
      ]
   },
   "garment_colors":[
      {
         "id":66,
         "name":"Purple",
         "color":"#4f237a"
      },
      {
         "id":67,
         "name":"Light Blue",
         "color":"#89b4df"
      },
      {
         "id":68,
         "name":"Carolina Blue",
         "color":"#91b0e6"
      }
   ]
}

模板-名称和品牌等其他属性正确显示

<script type="text/x-handlebars" data-template-name="designer">
    {{outlet}}
    <div id="product-details">
        <h4>Style</h4>
        <p id="name">{{name}}</p>
        <p id="brand">{{brand}}</p>
        <p id="description">{{description}}</p>
        <p id="materials">{{materials}}</p>
        <h4>Color</h4>

        {{log garment_colors}}
        <div id="color-list">
            {{#each garment_colors}}
                <label class="btn" style="background-color:{{color}}">
                    <input type="radio" name="color" value="{{name}}"> 
                </label>
            {{/each}}
        </div>
    </div>
</script>


{{outlet}}
风格
{{name}
{{brand}
{{description}
{{materials}
颜色
{{log garment_colors}}
{{{每件衣服的颜色}
{{/每个}}
重新适应程序

要求属性名称为

服装颜色

 "garment_colors":[
     66,
     67,
     68
  ]

在Handlebar中不支持添加这样的值，这取决于某些版本，它会将变形标记添加到html中

 <label class="btn" style="background-color:{{color}}">
    <input type="radio" name="color" value="{{name}}"> 
 </label>

您需要将其解除绑定，这将直接将其注入模板，但不会绑定到模型

 <label class="btn" style="background-color:{{unbound color}}">
    <input type="radio" name="color" value="{{unbound name}}"> 
 </label>

或者需要使用bind attr将属性绑定到属性

 <label class="btn" {{bind-attr style=someProperty}}>
    <input type="radio" name="color"  {{bind-attr value=name}}> 
 </label>

---

示例：

是否显示返回的json。模板不起作用了？刚刚添加了它，谢谢！我不太明白。我正在模板中使用服装颜色。你是说json键应该是“garment_color”而不是“garment_color_ID”？是的，json中的属性（对于RESTAdapter/RESTSerializer）将json键从“garment_color_ID”更改为“garment_color”。很遗憾，这应该是复数，garment_color，它应该与模型中的attr名称匹配。此外，您的模板存在一些问题，我将更新答案。