在模板中循環通過灰燼數據模型Attrs

我想弄清楚如何動態循環通過Ember數據模型的DS.attr的我已經傳入到Ember 2.0中的組件。下面是我有：在模板中循環通過灰燼數據模型Attrs

模板：

{{!person-component.hbs}} 
{{each-in person as |property value|}} 
    <tr> 
    <th> 
     <td>{{property}}</td> 
     <td>{{value}}</td> 
    </th> 
    </tr> 
{{/each-in}} 

{{!index.hbs}} 
{{person-component person=model}}

型號：

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    "name": DS.attr('string'), 
    "height": DS.attr('number'), 
    "weight": DS.attr('number'), 
});

路線：

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    model() { 
    return this.store.find('person'); 
    } 
});

有一個簡單的方法來從車把內做到這一點？我想可能是控制器上的計算值可能不得不這樣做。

來源

2015-08-27 Derek Dowling

你是從哪裏得到的？你的代碼沒有意義。 –

這是Ember 2.0的新功能。 –

啊，它是在2.1測試版中，我的糟糕的沒有看到博客文章。 –

好的，所以each-in不是神奇地取消了Ember模型屬性，只有普通的JSON對象。所以解決方案是使用控制器邏輯來獲取模型的屬性。有可能是一個更好的方法來做到這一點，但這是我在Ember有限的經驗中發現的最清潔的方法。

// app/controllers/person.js 

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    attributes: Ember.computed(function() { 
    var attrNames = []; 
    var person = this.get('person'); 

    // Get attributes 
    person.eachAttribute((name) => attrNames.push(name)); 

    var attrs = Ember.getProperties(person, attrNames); 
    return attrs; 
    }), 
});

如果實施此與上面的代碼，一切正常，只要您修改模板使用attributes而非person預期。

來源

2015-09-03 23:41:44

只要您使用Ember 2.1 Beta，您的代碼應該可以正常工作。查看關於新each-in幫手的博客文章。

http://emberjs.com/blog/2015/08/16/ember-2-1-beta-released.html#toc_code-each-in-code-helper

這個助手的工作原理完全爲您發佈。

編輯

實際上，根據意見，get和each-in助手居然潛入灰燼2.0（暗訪），在這裏看到評論：http://emberjs.com/blog/2015/08/16/ember-2-1-beta-released.html#comment-2202060073，因此無需使用測試版。

來源

2015-08-28 12:33:30 knownasilya

在模板中循環通過灰燼數據模型Attrs

回答

相關問題