我们无法将一个阵列控制器的内容与Ember.js中另一个阵列控制器的内容相关联。我们已经搜索过Stackoverflow,但似乎没有任何解决方案适合我们。
情景很简单。我们有一个名为“Campaign”的模型。该模型非常基本,看起来像这样......
广告系列模型:
App.Campaign = DS.Model.extend({
name: DS.attr('string'),
description: DS.attr('string'),
opts: DS.attr('string'),
starred: DS.attr('boolean'),
keywords: DS.hasMany('App.Keyword')
});
// Create dummy campaign array
App.Campaign.FIXTURES = new Array();
// Populate dummy campaign array
...
Campaign控制器也是基本的。这是一个简单的ArrayController,里面没有任何东西......
广告系列索引控制器:
App.CampaignsIndexController = Em.ArrayController.extend({
});
为了这个问题,我们已经将我们的应用程序模板剥离到了基本要素。如下所示,应用程序模板有一个侧边栏。侧边栏中有两个视图。一个视图用于网站的导航,另一个视图用于“加星标的广告系列”。此视图将包含整个广告系列集的一部分。
申请模板:
<!-- ================================================== -->
<!-- ======================= APP ====================== -->
<!-- ================================================== -->
<div id="app" class="">
<!-- ================================================== -->
<!-- ==================== SIDEBAR ===================== -->
<!-- ================================================== -->
<div id="sidebar">
{{ view App.NavigationView }}
{{ view App.StarredCampaignsView controller="App.StarredCampaignsController" }}
</div>
<!-- ================================================== -->
<!-- ====================== PAGE ====================== -->
<!-- ================================================== -->
<div id="page" class="">
{{ outlet page }}
</div>
</div>
我们有一个Starred Campaigns控制器。这是事情开始变得混乱的地方。在我们的控制器中,我们将ArrayController的内容绑定到CampaignsIndexController的内容,该内容包含所有Campaign模型的数组。
已加星标的广告系列控制器:
App.StarredCampaignsController = Em.ArrayController.extend({
content: [],
contentBinding: Ember.Binding.oneWay('App.CampaignsIndexController.content')
});
对于已加星标的广告系列的观点也非常简单......
已加星标的广告系列视图:
App.StarredCampaignsView = Em.View.extend({
templateName: 'templates/layout/starred-campaigns',
});
这就是Starred Campaigns的模板。它试图遍历controller.content中的项目并将它们传递给另一个视图。
已加星标的广告系列模板:
<h5 class="sidebar-title">Starred Campaigns</h5>
<ul class="starred-campaigns clearfix">
{{# each item in controller.content }}
{{ view App.StarredCampaignItemView itemBinding="item" }}
{{/ each }}
</ul>
然而,尽管如此,即使我们填充由App.CampaignsIndexController表示的App.Campaign数组,StarredCampaignsController中的内容仍为空。看到我们的方法有任何问题?我觉得我们在这里错过了一些非常简单的东西。
答案 0 :(得分:1)
在Ember中,要使控制器需要其他控制器,您需要使用needs
属性。这在Ember中总是在变化:在以前的版本中,路由器负责this.controllerFor
,即使是旧版本,这种方法更类似于您似乎尝试采用的方法。但是,最终方法早已被弃用,控制器/模型/视图的实例不再直接在App
上保留,只有对象表示。
要直接使用need
,您需要告诉App.StarredCampaignsController
控制器它需要App.CampaignsIndexController
,如此:
App.StarredCampaignsController = Em.ArrayController.extend({
content: [],
needs: ['campaigns_index']
});
您现在可以在已加星标的广告系列视图中访问App.CampaignsIndexController
控制器:{{controllers.campaigns_index}}
。
查看简单的JSFiddle:http://jsfiddle.net/AGJfB/
你的工作不起作用的原因是因为你引用了控制器的对象,而不是它的实例:
Ember.Binding.oneWay('App.CampaignsIndexController.content')
虽然App.CampaignsIndexController
上有App
,但这是它的对象。当您通过任何Ember方式访问它时,Ember将为您创建实例(this.controllerFor
,needs
,通过URL导航到它等等。)
在过去的日子里,我们可以使用:
Ember.Binding.oneWay('App.campaignsIndexController.content')
但是,这是一种糟糕的做事方式,因为你引用了控制器的绝对路径。自从Ember pre 1以来,我从未使用过Ember.Binding.oneWay
,但仍然会出现需要它的情况。当你发现自己使用它时,可能明智地问自己是否有必要,以及是否有更好的方法来做到这一点。
我希望我能很好地解释自己。请随时提出任何问题!