2014-11-07 2 views
1

Ember.js 응용 프로그램에서 작업하고있는 장치 목록이 있습니다. 여기 나열된 각 장치를 클릭 할 때 해당 장치를 모델로 사용하여 모달 대화 상자를 열 수 있습니다. 대화 상자. 공식 문서는이 작업을 수행하는 방법이 다소 모호하므로 일부 추측을 수행하고 있습니다. 나는 템플릿 내부 매개 변수로 각 장치의 ID를 전달하려고 :ember #each 내의 다른 모델

{{#each}} 
    <button data-toggle="modal" data-target="#modal" {{action 'openViewModal' 'viewDeviceModal' id}} class="btn btn-default btn-xs">View details</button> 
{{/each}} 

{{id}} 작품을 다른 템플릿에 의도 한대로.

actions: { 
openModal: function(modalName, id) { 
    this.controllerFor(modalName).set("model", this.store.find('device', id)); 
    return this.render(modalName, { 
    into: "application", 
    outlet: "deviceModal" 
    }); 
}, 

이 나에게 다음과 같은 오류 제공 :

이제 경로 안에, 내가이 넣어 아마도

"The value that #each loops over must be an Array. You passed (generated devices controller)" 

을, 장치 목록의 모델과 약간의 혼동이 (가 #each) 및 모달 대화 상자의 모델입니다. 모달 대화 상자 안에 #each이 없습니다.

또한 내 변수가 실제로 무엇인지 생각할 수있는 방법이 부족합니다. console.log이 작동하지 않습니다. 나는 디버거 엠버에 관한 모든 문서를 아직 읽지 않았으므로 거기에 약간의 포인터가있을 것을 기대하고있다. 한편 모달 대화 상자 모델을 작동시키는 방법에 대한 도움은 크게 감사하겠습니다.

답변

1

이것은 각 루프에는 문제가되지 않지만 모델에는 문제가 없습니다. 레코드의 배열을 기대하는 경우 컨트롤러에 대해 model을 단일 레코드로 설정합니다. 여기에 액션의 첫 번째 줄을 변경 : 이미 그것을 가지고 때

this.controllerFor(modalName).set("model", [this.store.find('device', id)]); 

또한, 끝으로 다시 가게에서 레코드를로드하지 않습니다. 그냥 액션 도우미에서 모든 기록을 통과 :

{{action 'openViewModal' 'viewDeviceModal' this}} 

그런 다음 액션 핸들러는 다음과 같이 할 수 있습니다 제안에 대한

openModal: function(modalName, record) { 
    this.controllerFor(modalName).set("model", [record]); 
+0

감사합니다! 그것을 보면서 완벽한 감각을 지녔지 만, 당신이 '이런'것을 사용할 수 있다는 것은 결코 내게 발생하지 않았을 것입니다. 내 상상의 실패. – Osthekake

관련 문제