在 Ember CLI 的模板中使用 ObjectController 从模型中获取数据答案

【问题标题】：Getting data from a model using an ObjectController from within the template in Ember CLI在 Ember CLI 的模板中使用 ObjectController 从模型中获取数据
【发布时间】：2015-02-23 21:10:28
【问题描述】：

我正在尝试将单个模型加载到我的 ObjectController 中，但我很难让它显示在我的模板中。我的其他路由使用 ArrayController 所以当我在模板中时，我只需执行以下操作来遍历每个对象：

{{#each item in model}}
    ..
    {{item.firstName}}
    ..
{{/each}}

但如果模型中的项目不超过一个，我无法弄清楚如何做到这一点。查看以下链接：Ember.js Docs on ObjectController 它应该非常简单，但我的似乎无法正常工作。下面是我正在使用的存根代码。任何帮助表示赞赏。谢谢！

app/router.js:

import Ember from 'ember';
import config from './config/environment';

var Router = Ember.Router.extend({
});

Router.map(function() {

    this.route('login', {path: '/'}, function(){
        this.resource('login');
    });

    this.route('items', {path: '/items'}, function(){
        this.resource('items');
    });

    this.route('item-details', {path: '/item/:item_id'}, function(){
        this.resource('item-details');
    });

});
export default Router;

app/routes/item-details.js：

import Ember from 'ember';

export default Ember.Route.extend({
    model: function(params){
        return this.store.find('item-details');
    }
});

app/models/item-details.js：

import DS from 'ember-data';

var ItemDetails = DS.Model.extend({
    itemNumber: DS.attr('string')
});

ItemDetails.reopenClass({
    FIXTURES: [
        {id: 1, itemNumber: '0000001'}
    ]
});

export default ItemDetails;

app/controllers/item-details.js：

import Ember from 'ember';

export default Ember.ObjectController.extend({
});

app/templates/item-details.hbs：

Item Number: {{itemNumber}}<br/>
{{model}}<br/>
{{model.itemNumber}}<br/>
{{model.data.itemNumber}}<br/>
{{content.itemNumber}}<br/>
{{model.content.0.itemNumber}}<br/>

上面运行时模板的显示值为：

Item Number: 
<DS.RecordArray:ember377>
<three blanks>
0000001

我还验证了 DS 确实已创建。我可以在 Ember 调试器中查看它。

【问题讨论】：

标签： javascript ember-cli

【解决方案1】：

我的一位同事想通了，这就是我们所做的：

app/routes/item-details.js：

import Ember from 'ember';

export default Ember.Route.extend({
    model: function(params){
        return this.store.find('item-details', params.item_id);
    }
});

app/models/item-details.js：

import DS from 'ember-data';

var ItemDetails = DS.Model.extend({
    itemNumber: DS.attr('string')
});

ItemDetails.reopenClass({
    FIXTURES: [
        {id: '0000001', itemNumber: '0000001'}
    ]
});

export default ItemDetails;

问题似乎在于它仍然返回一个项目数组，因为它可能最初使用 .find() 表示法从数据存储接收多个项目？

以上模板的任何更改都可以正常工作和显示：

Item Number: {{itemNumber}}

【讨论】：