embjerjs从动态数据中选择

时间:2015-05-16 21:49:48

标签: javascript ember.js ember-cli

我正在使用没有余烬数据的ember-cli。

我有一个表单,需要从api响应中的某些数据生成的选择下拉列表。这是api回应:

{
  "data": [
    {
      "id": 1,
      "name": "host"
    },
    {
      "id": 2,
      "name": "cPanel"
    },
    {
      "id": 3,
      "name": "website"
    }
  ]
}

我正在使用ember select视图生成下拉列表:

{{view "select" content=groups optionValuePath="content.id" optionLabelPath="content.name"}}

这是我的控制器:

groups: function(){
            var self = this;
            var model = this.get('model');
            var adapter = AddCredentialAdapter.create();
            var groups = adapter.findGroups(model.company_slug);
            return groups.then(function(response){
                return response;
            });
    }.property('credentialGroups', 'model')

我一直收到错误:

Assertion Failed: The value that #each loops over must be an Array. You passed {_id: 91, _label: undefined, _state: undefined, _result: undefined, _subscribers: }

所以我试着这样做:

groups: function(){
            var self = this;
            var model = this.get('model');
            var adapter = AddCredentialAdapter.create();
            var groups = adapter.findGroups(model.company_slug);
            return groups.then(function(response){
                return response.map(function(c){
                    return {
                        id: c.id,
                        name: c.name
                    }
                });
            });
    }.property('credentialGroups', 'model')

但由于某种原因,承诺仍然是传递给视图的内容,我得到了同样的错误:

Assertion Failed: The value that #each loops over must be an Array. You passed {_id: 91, _label: undefined, _state: undefined, _result: undefined, _subscribers: }

如果我console.log(response);我没有得到承诺。我得到了这个:

[Object, Object, Object, _super: function, nextObject: function, firstObject: Object, lastObject: Object, contains: function…]

1 个答案:

答案 0 :(得分:0)

是的,你肯定试图用承诺来设置select的内容属性。计算属性不会阻止返回一个承诺,就像你希望它会在这里一样。解决方法:

groups: null,
setGroups: function(){
     var self = this;
     var model = this.get('model');
     var adapter = AddCredentialAdapter.create();
     var groups = adapter.findGroups(model.company_slug);
     groups.then(function(response){
         self.set('groups', response);
     });
}.observes('credentialGroups', 'model'),
//not sure how select handles null
initialize: function(){
    this.set('groups', []);
}.on('init')

这里的想法是select选择一个由一个函数设置的属性,该函数观察从属键的变化。初始化代码可能是必需的,也可能不是必需的。