1
我有一些事情是这样的：emberjs Ember.Select动态contentBinding
window.App = Ember.Application.create();
App.Person = Ember.Object.extend({
id: null,
firstName: null,
lastName: null,
fullName: function() {
return this.get('firstName') + " " + this.get('lastName');
}.property('firstName', 'lastName')
});
App.selectedPersonController = Ember.Object.create({
person: null
});
App.selectedChildrenController = Ember.Object.create({
person: null
});
App.peopleController = Ember.ArrayController.create({
content: [
App.Person.create({
id: 1,
firstName: 'John',
lastName: 'Doe'
}),
App.Person.create({
id: 2,
firstName: 'Tom',
lastName: 'Cruise'
}),
App.Person.create({
id: 3,
firstName: 'Peter',
lastName: 'Pan'
}),
App.Person.create({
id: 4,
firstName: 'Sergey',
lastName: 'Brin'
})
]
});
App.childrenController = Ember.ArrayController.create({
children: [
App.Person.create({
person_id: 1,
firstName: 'Scott',
lastName: 'Hall'
}),
App.Person.create({
person_id: 1,
firstName: 'Jim',
lastName: 'Can'
}),
App.Person.create({
person_id: 2,
firstName: 'Will',
lastName: 'Smith'
}),
App.Person.create({
person_id: 4,
firstName: 'Bale',
lastName: 'Ron'
})
],
active: function() {
if (App.selectedPersonController.person) {
return this.get("children").filterProperty("person_id", App.selectedPersonController.person.id);
}
else {
return null;
}
}.property("App.selectedPersonController.person").cacheable()
});
window.App.Select = Ember.Select.extend({
contentChanged: function() {
this.$().selectBox('destroy').selectBox();
}.observes('content')
});
和我的视图代码是这样的：
<script type="text/x-handlebars">
{{view window.App.Select
contentBinding="App.peopleController"
selectionBinding="App.selectedPersonController.person"
optionLabelPath="content.fullName"
optionValuePath="content.id"
prompt="Pick a person:"}}
{{view window.App.Select
contentBinding="App.childrenController.active"
selectionBinding="App.selectedChildrenController.person"
optionLabelPath="content.fullName"
optionValuePath="content.id"
prompt="Pick a child:"}}
<p>Selected: {{App.selectedPersonController.person.fullName}}
(ID: {{App.selectedPersonController.person.id}})</p>
</script>
我希望我的第二window.App.Select根据第一个窗口中的选择动态更新.App.Select。我使用contentBinding =“App.childrenController.active”第二window.App.Select，使这项工作，但它的作用是，如果我选择了一个人的价值选择框的选择框孩子不更新，现在当我选择选择框孩子seletbox获取与根据我以前的人选择框中选择的过滤值填充的人不同的人。
人选择框 - >选择=李四（Nothing发生）
人选择框 - >选择=汤姆·克鲁斯（儿童选择框被根据“李四”选择过滤）
等。
请看看有什么不对的地方。