1
나는 (일반적으로 런타임에 검색되는) 데이터 값을 양식 요소에 바인딩해야하는 시나리오가 있습니다. 이 경우 요소는 임의의 길이 데이터 집합에 대해 반복적으로 렌더링되는 Ember.Select입니다.Ember에 바인딩. atemplate 루프 내에서 선택
jsFiddle 여기
두 생성 선택 요소가 다른 데이터 구조에 기초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').cacheable()
});
App.peopleController = Ember.ArrayController.create({
content: [
App.Person.create({id: 1,firstName: 'Yehuda',lastName: 'Katz'}),
App.Person.create({id: 2,firstName: 'Tom',lastName: 'Dale'}),
App.Person.create({id: 3,firstName: 'Peter',lastName: 'Wagenet'}),
App.Person.create({id: 4,firstName: 'Erik',lastName: 'Bryn'})
]
});
App.simpleSelectionArray = Ember.ArrayController.create({
content: [
App.peopleController.objectAt(1)
]});
App.selectionArray = Ember.ArrayController.create({
content: [
{
id: '2',
person: Ember.computed(function(key, value) {
if (arguments.length === 1){
var personId = this.get('id');
console.log(personId);
var listedPerson = App.peopleController.content.findProperty("id", personId);
return listedPerson ;
}else{
this.set(key,value);
return value;
}
}).property('id').cacheable()
},
]});
<script type="text/x-handlebars">
{{#each App.simpleSelectionArray.content}}
{{this.firstName}}
{{view Ember.Select
contentBinding="App.peopleController.content"
selectionBinding="this"
optionLabelPath="content.fullName"
optionValuePath="content.id"}}
<p>Selected: {{this.fullName}}
(ID: {{this.id}})</p>
{{/each}}
{{#each App.selectionArray.content}}
{{this.person.firstName}}
{{view Ember.Select
contentBinding="App.peopleController.content"
selectionBinding="this.person"
optionLabelPath="content.fullName"
optionValuePath="content.id"}}
<p>Selected: {{this.person.fullName}}
(ID: {{this.person.id}})</p>
{{/each}}
</script>
찾을 수있다. 첫 번째 (대부분)는 바인딩 포스트 선택을 제외하고 예상대로 작동합니다.
더 일반적인 두 번째 데이터 구조가 전혀 작동하지 않습니다.
의견이 있으십니까?
흠, 당신의 질문을 이해할 수 있을지 모르겠다. 당신은 반복하고자하는 아이템의 배열을 가지고 있으며 각 반복 안에는 ''을 보여주고 싶다.'옵션은 모든 아이템에 대해 동일하다. 이 '선택'항목을 선택하면 항목 자체에 저장됩니다. 지금 나는 나의 질문을 분명하게했는지 모른다. 음 .. – pangratz
실제 응용 프로그램에서 내 데이터는 각각 가변 수의 조건을 포함하는 일련의 규칙으로 구성됩니다. 조건은 동일한 선택 옵션에서 작성됩니다. rule : {considtions : []} – user1481567
저장을 원하거나 다른 작업에 사용할 수있는 데이터가 있습니다. 두 배열의 길이가 가변적이어서 다른 예제와 같이 전역 경로를 사용하여 바인딩하는 방법을 알 수 없습니다. 그래서 여기에 {{#each}} 루프 내부의 로컬 템플릿 컨텍스트에 바인딩하려고합니다. 기본값을 설정하는 원래 조건에 바인딩합니다. – user1481567