2012-01-26 2 views
2

저는 엠버 (ember)를 처음 사용합니다.ember.js <select> 두 개의 다른 객체로 채워지고 선택되었습니다.

외부 데이터 소스에서 제공된 3 개의 값으로 채워진 선택 드롭 다운을 만들려고합니다. 또한 다른 모델에 저장된 값을 기반으로 선택된 목록에서 올바른 값을 갖고 싶습니다.

내가 본 적이있는 대부분의 예제는 정적으로 정의 된 드롭 다운을 처리합니다.

{{#view contentBinding="App.formValues.propertyType" valueBinding="App.property.content.propertyType" tagName="select"}} 
    {{#each content}} 
    <option {{bindAttr value="value"}}>{{label}}</option> 
    {{/each}} 
{{/view}} 

그리고 내 모듈 : 지금까지 내가 무엇을 가지고

App.formValues = {}; 
App.formValues.propertyType = Ember.ArrayProxy.create({ 
    content: [ 
     Ember.Object.create({"label":"App","value":"app", "selected": true}), 
     Ember.Object.create({"label":"Website","value":"website", "selected": false}), 
     Ember.Object.create({"label":"Mobile","value":"mobile", "selected": false}) 
    ] 
}); 

그리고 마지막으로 내 객체 :

App.Property = Ember.Object.extend({ 
    propertyType: "app" 
}); 

App.property = Ember.Object.create({ 
    content: App.Property.create(), 

    load: function(id) { 
     ...here be AJAX 
    } 
}); 

드롭 다운이 채워집니다 있지만 상태가되지 않습니다 선택되어 App.property의 값을 반영합니다. 나는 몇몇 조각이 빠져 있다는 것을 알고있다. 나는 어떤 방향으로 가야 하는지를 말해 줄 사람이 필요하다.

+0

나는 당신이 잘못하고 있는지 여부를 누군가가 말할 수 있기 전에 무엇을하고 있는지 보여 주어야한다고 생각합니다. – Pointy

+0

@Pointy 우연히 미리 입력하십시오. SO가 "제출을 취소"해야합니다. –

+1

나는 평판 점수를 얻었을 가능성이 높다고 생각했습니다 :-) – Pointy

답변

2

답은 formValues에서 .observes()를 사용했을 때의 답이었다. 어떤 이유로 인해 .property()는 오류가 발생하지만 .observes()는 오류를 발생시키지 않습니다.

나는 전체 AJAX 솔루션을 여기에 게시하여 참조 할 수 있으며 이후 개발 내용이 있으면 업데이트 할 예정입니다.

App.formValues = {}; 
App.formValues.propertyType = Ember.ArrayProxy.create({ 
    content: [], 

    load: function() { 
     var that = this; 

     $.ajax({ 
      url: "/api/form/propertytype", 
      dataType: "json", 
      success: function(data) { 
       that.set("content", []); 
       _.each(data, function(item) { 
        var optionValue = Ember.Object.create(item); 
        optionValue.set("selected", false); 
        that.pushObject(optionValue); 
       }); 
       that.update(); 
      } 
     }); 
    }, 

    update: function() { 
     var content = this.get("content"); 
     content.forEach(function(item) { 
      item.set("selected", (item.get("value") == App.property.content.propertyType)); 
     }); 
    }.observes("App.property.content.propertyType") 
}); 
App.formValues.propertyType.load(); 
관련 문제