Ember Populating EmberData를 사용하여 종속 컨트롤러에서 선택 지연로드

Question

Dojo로 약 10 분 만에 해결할 수있는 간단한 문제에 대해 약 10 일을 소비했습니다. 나는 간단한 것을 놓치기를 바란다. 나는 Ember를 사용하고자하는 놈이다.

EmberData를 사용하여 다른 컨트롤러의 데이터로 Ember.Select의 내용을 채우려고합니다. 사례를 고려해보십시오. 원료 성분에 대해 FoodGroup을 선택할 수 있습니다.

RawIngredientController와 FoodGroupsController 사이에 'needs'의존성을 사용하고 내용에 바인딩하는 것이 명확하게 보였습니다.

이것은 성공에 가장 가깝고 나에게 충분하지 않은 것으로 보입니다. 나는 설명 할 것입니다.

<script type="text/x-handlebars" data-template-name="rawIngredients"> 

    {{#each item in controller itemController="rawIngredient" }} 

      {{! view Ember.Select 
        contentBinding="controllers.foodGroups.content" 
        optionValuePath="content.id" 
        optionLabelPath="content.name" 
        prompt="select Food Group" }} 

    {{/each}} 
</script> 

Cook.RawIngredientController = Ember.ObjectController.extend({ 
    isEditing: false, 
    needs: ['foodGroups'], 
    ... 
}); 


Cook.RawIngredient = DS.Model.extend({ 
    name: DS.attr('string'), 
    nameKey: DS.attr('string'), 
    foodGroup: DS.belongsTo('Cook.FoodGroup') 
}); 

Cook.FoodGroupsRoute = Ember.Route.extend({ 
    setupController: function(controller) { 
    controller.set('content', Cook.FoodGroup.all()); // have also tried find() 
    } 
}); 

Cook.FoodGroup = DS.Model.extend({ 
    name: DS.attr('string'), 
    nameKey: DS.attr('string') 
}); 

실제로 모든 RawIngredients에는 오류가 없지만 FoodGroups 저장소가 비어 있기 때문에 Selects는 비어 있습니다. 저장소를로드하고 RawIngredients로 돌아가는 FoodGroups 화면으로 이동하여 선택 항목에 FoodGroups가 채워집니다.

이 문제에 대한 여러 게시물을 보았지만 EmberData가 관련되어있을 때 문제를 충분히 해결하지 못했습니다. pangratz http://jsfiddle.net/pangratz/hcxrJ/의 영리한 예제처럼 포스트로드 된 예제가 많이 있지만, EmberData를 사용하여 콘텐츠를 지연로드하지 못했습니다.

이 게시물이

은 Ember.js: Ember.Select valueBinding and lazy loading

아주 가까이 내가이 일을 가져올 수 없습니다 관찰자를 사용하여 해결 방법을 포함하고 있습니다. FoodGroup 데이터의 실제로드를 호출하지 않는 바인딩에 바인딩을 종료했습니다. 다음은 예입니다, 아마 최고의 (20 + 아마의) 하나 개의 시도 :

Cook.FoodGroupsController = Ember.ArrayController.extend({ 
    ... 
     // NOTE: This seems redundant 
    values: function() { 
     return this.get('content'); 
    }.property(), 
    ... 
}); 

Cook.RawIngredientController = Ember.ObjectController.extend({ 
    ... 
    // this should be the instance; also tried the object name FoodGroupsController....also tried using needs + 'controllers.foodGroups.values' in the binding 
    allFoodGroups: Ember.Binding.oneWay('Cook.foodGroupsController.values'), ' 

    /* 
    // ... or rather ....?? 

    allFoodGroups: function() { 
     this.get('foodGroupsBinding'); 
    }, 
    foodGroupsBinding: "Cook.foodGroupsController.values", 
    */ 

    ... 
}); 

     {{view Ember.Select 
       contentBinding="allFoodGroups" 
       optionValuePath="content.id" 
       optionLabelPath="content.name" 
       prompt="select Food Group" }} 

하지만 'allFoodGroups'을 말하는 것이 오류는 바인딩이 아닌 Ember.Array를 제공하고 있습니다. 소용돌이 치는 명명 규칙의 바다에서 길을 잃은 것 같습니다. 내 다른 시도를 보여줄 수 있지만 정의되지 않은 내용의 오류가있었습니다.

어. 따라서 약간의 백업은 ... 적어도 필자의 독창적 인 솔루션을 사용하고 FoodGroups 저장소를 미리로드하면 해결 방법이 제공되지만 EmberData가 프로그래밍 방식으로 데이터를로드하고로드 할 수없는 것처럼 보입니다. RawIngredientController에서 init() 함수를 사용해 보았습니다.

init: function() { 
    var item = this.get('controllers.foodGroups.content.firstObject'); 
}, 

그러나 올바른 조합을 찾지 못했습니다. 그리고 비록 그렇게해도 RawIngredients (또는 FoodGroups?)의 단일 참조를 사용하지 않고 각 RawIngredient에 대한 참조를 설정하기 때문에 잘못된 접근 방법 인 것처럼 보입니다. 그러나 다른 주제와 같습니다.

이 http://jsfiddle.net/jockor/Xphhg/13/

사람이 다른 컨트롤러에 정의 된 사용 저장소를로드 할 수있는 효율적이고 효과적인 방법을 알아 냈나요 문제를 설명하는 바이올린에서 내 시도에 EmberData 사용되는 관련 내용을 게으른 -로드?

Answer 1

기본적인 문제는 foodGroups 경로에 액세스하지 않아서 setupController()가 실행되지 않으므로 선택 컨트롤러의 내용이 설정되지 않는다는 것입니다.

예를 들어 문제의 경로에 링크를 추가하고 클릭하면 경로가 초기화되고 바인딩이 작동합니다.

JSFiddle을 업데이트하려고했지만 잠시 동안 업데이트되지 않은 Github의 ember-data의 "최신"버전에 연결됩니다. 공식 릴리스를 만들기 전까지는 직접 빌드해야합니다.), Ember의 구버전을 사용하기 때문에 이상한 오류가 발생했습니다. 당신이 국가 링크를 클릭 할 때 발생하는 http://jsfiddle.net/tPsp5/

주의 사항 : 그래서 여기

최신 엠버와 엠버 - 데이터가있는 버전입니다. 나는 당신이 무엇이 언제 호출되는지 이해하는 데 도움이 될 수있는 어떤 debugger; 문을 남겼습니다.

---

디자인 노트에서 "상위"컨트롤러는 "자식"컨트롤러에 의존하지 않아야합니다.