控制器上 JS 对象的访问属性
Access Properties of JS Object on Controller
我创建了一个 Ember.JS 应用程序,我在 ApplicationController
上挂了一些属性,这些属性需要在整个应用程序中都可以访问。这些属性之一是按服务器名称(JS 数组)细分的队列(JS 对象)。在我的模板中,我想列出每个数组的项目,但我不确定该怎么做。我读了这个 question 但我不太明白答案。
对于我的代码,我有:
App.ApplicationController = Ember.Controller.extend({
currentUser: null,
queuedPlayers: {
"The Bastion": [],
"Begeren Colony": [],
"The Harbinger": [],
"The Shadowlands": [],
"Jung Ma": [],
"The Ebon Hawk": [],
"Prophecy of the Five": [],
"Jedi Covenant": []
}
});
另一个控制器:
App.IndexController = Ember.Controller.extend({
needs: ['application'],
currentUser: Ember.computed.alias('controllers.application.currentUser'),
queuedPlayers: Ember.computed.alias('controllers.application.queuedPlayers'),
...
并且在模板中:
{{#each server in servers}}
<h2>{{server}}</h2>
{{#each player in queuedPlayers[server]}}
{{player}}
{{/each}}
{{/each}}
servers
是服务器数组(与 queuedPlayers
中的属性相匹配)我正在传递给模板以用作 select 列表的内容属性,因此{{server}}
标签呈现良好。然而,queuedPlayers[server]
或 queuedPlayers.get(server)
显然不起作用,因为这不是车把的工作方式,但这是我想要实现的。
我主要是一名 Python 开发人员,所以 JS 对我来说有点陌生,所以我不熟悉它的所有细微差别。
您需要创建一个组件并传入必要的属性才能完成此操作。
{{#each server in servers}}
<h2>{{server}}</h2>
{{queued-players collection=queuedPlayers selection=server}}
{{/each}}
排队玩家模板
{{#each player in players}}
{{player}}
{{/each}}
排队玩家 js
players: function(){
return this.get('collection')[this.get('selection')];
}.property('collection.[]', 'selection')
我创建了一个 Ember.JS 应用程序,我在 ApplicationController
上挂了一些属性,这些属性需要在整个应用程序中都可以访问。这些属性之一是按服务器名称(JS 数组)细分的队列(JS 对象)。在我的模板中,我想列出每个数组的项目,但我不确定该怎么做。我读了这个 question 但我不太明白答案。
对于我的代码,我有:
App.ApplicationController = Ember.Controller.extend({
currentUser: null,
queuedPlayers: {
"The Bastion": [],
"Begeren Colony": [],
"The Harbinger": [],
"The Shadowlands": [],
"Jung Ma": [],
"The Ebon Hawk": [],
"Prophecy of the Five": [],
"Jedi Covenant": []
}
});
另一个控制器:
App.IndexController = Ember.Controller.extend({
needs: ['application'],
currentUser: Ember.computed.alias('controllers.application.currentUser'),
queuedPlayers: Ember.computed.alias('controllers.application.queuedPlayers'),
...
并且在模板中:
{{#each server in servers}}
<h2>{{server}}</h2>
{{#each player in queuedPlayers[server]}}
{{player}}
{{/each}}
{{/each}}
servers
是服务器数组(与 queuedPlayers
中的属性相匹配)我正在传递给模板以用作 select 列表的内容属性,因此{{server}}
标签呈现良好。然而,queuedPlayers[server]
或 queuedPlayers.get(server)
显然不起作用,因为这不是车把的工作方式,但这是我想要实现的。
我主要是一名 Python 开发人员,所以 JS 对我来说有点陌生,所以我不熟悉它的所有细微差别。
您需要创建一个组件并传入必要的属性才能完成此操作。
{{#each server in servers}}
<h2>{{server}}</h2>
{{queued-players collection=queuedPlayers selection=server}}
{{/each}}
排队玩家模板
{{#each player in players}}
{{player}}
{{/each}}
排队玩家 js
players: function(){
return this.get('collection')[this.get('selection')];
}.property('collection.[]', 'selection')