ArrayProxy 需要一个 Array 或 Ember.ArrayProxy，但您传递了对象

Question

我收到此错误：

ArrayProxy expects an Array or Ember.ArrayProxy, but you passed object

我正在使用 active-model-serializers 从 rails 应用程序获取数据。数据显示在我的 ember 检查器中，但我的模板在控制台中出现此错误时无法正确呈现。

Router.map(function() {
  this.resource('brands', function() {
    this.resource('brand', { path: '/:brand_id' });
  });

  this.resource('campaigns', function() {
    this.resource('campaign', { path: '/:campaign_id' },
    this.resource('index'), { path: 'brands/:brand_id' });
  });
});

export default Ember.Route.extend({
  model: function() {
    return Ember.RSVP.hash({
      brand: this.store.find('brand'),
      campaign: this.store.find('campaign') 
    });
  }
});

export default DS.Model.extend({
  name: DS.attr('string'),
  facebook_page_id: DS.attr('string'),
  active: DS.attr('boolean'),
  facebook_uid: DS.attr('string'),
  facebook_token: DS.attr('string'),
  facebook_token_expires: DS.attr('string'),
  website_url: DS.attr('string'),
  privacy_policy_link: DS.attr('string'),
  terms_link: DS.attr('string'),
  instagram_account: DS.attr('string'),
  instagram_url: DS.attr('string'),
  twitter_account: DS.attr('string'),
  twitter_url: DS.attr('string'),
  avatar_url: DS.attr('string'),
  youtube_account: DS.attr('string'),
  youtube_url: DS.attr('string'),
  favicon_url: DS.attr('string'),
  open_graph_url: DS.attr('string'),
  campaigns: DS.hasMany('campaign', {async: true})
});

export default DS.Model.extend({
  name: DS.attr('string'),
  brand_id: DS.attr('string'),
  brand: DS.belongsTo('brand', {async: true})
});

{{#each brand in controller}}
  <a>
    {{#link-to 'brand' this}}
       {{brand.name}} 
     {{/link-to}}
   </a>
{{else}}
   <a>No brands found.</a>
{{/each}}

服务器日志中没有错误。

Answer 1

Embers 默认的索引控制器是ArrayControllers，它期望他们的模型是一个数组。 在 的模型钩子中 - 看起来是 - 您的 BrandsIndexRoute 您将模型指定为

Ember.RSVP.hash({
  brand: this.store.find('brand'),
  campaign: this.store.find('campaign') 
});

返回 single object，而不是预期的 array of brands。
你应该做的是：

//brands route
export default Ember.Route.extend({
  model: function() {
    return this.store.find('brand');
  }
});

//campaigns route
export default Ember.Route.extend({
  model: function() {
    return this.store.find('campaign');
  }
});

Answer 2

您正在尝试迭代控制器，但您的控制器正在装饰一个带有两个属性的对象，而不是一个数组。您的对象如下所示：

{
  brand: [...],
  campaign: [...]
}

此外，如果您将控制器定义为数组控制器，它将引发此错误（我猜这是真的发生了）。因为您将对象而不是数组传递给控制器​​。