Ember.js 라우터/컨트롤러 속성

Question

model 속성이나 경로 대 컨트롤러의 content 속성을 감싸고 있습니다. 경로에 model 속성을 설정하면 생성 된 컨트롤러의 content 속성으로 자동 설정됩니다.

또한 컨트롤러의 content 속성을 사용하면 템플릿에서 해당 개체의 특성에 액세스 할 수 있다고 생각합니까?

문서를 읽었지만 여전히 이러한 규칙 중 일부를 요약하는 데 문제가 있습니다.

Answer 1

here으로 대답하면 Ember.Route에는 model 기능이 있습니다.이 기능을 사용하면 개체 또는 개체 모음을 해당 경로의 모델로 설정할 수 있습니다. 단일 개체를 처리하는 경로는 Ember.ObjectController까지 확장되는 컨트롤러가 있어야하며 개체 컬렉션을 처리하는 경로에는 Ember.ArrayController까지 확장되는 컨트롤러가 있어야합니다. 워크 플로 Route 워크 플로에서 model 후크에서 오는 데이터는 setupController 후크를 통해 컨트롤러의 content 속성에 설정됩니다.

경로에는 컨트롤러를 설정하는 자체 워크 플로가 있으므로 기본적으로이 메서드가 호출되어 모델에 콘텐츠가 채워집니다. 다음 사항을 고려하십시오

fiddle

App.Email = DS.Model.extend({ 
    address: DS.attr('string'), 
    isActive: DS.attr('boolean') 
}); 

App.Router.map(function() { 
    this.resource('emails', function() { 
     this.route('email', {path: ':email_id'}); 
    }); 
}); 

App.EmailsRoute = Ember.Route.extend({ 
    model: function() { 
     return App.Email.find(); 
    } 
}); 
App.EmailRoute = Ember.Route.extend({ 
    model: function(params) { 
     return App.Email.find(params.email_id); 
    } 
}); 

App.EmailsController = Ember.ArrayController.extend(); 
App.EmailController = Ember.ObjectController.extend(); 

(당신이 원하는 경우에 당신이 무시할 수 있습니다)과 같을 것이다, 설치 컨트롤러하기 위해이 노선에 대한 기본 코드를 생성해야하는 프레임 워크 :

을 :

App.EmailsRoute = Ember.Route.extend({ 
    ... 
    setupController: function(controller, model) { 
     controller.set('content', model); 
    } 
    ... 
}); 

는 경우 (위의 링크 된 질문/대답을 참조)하는 당신은, 예를 들어, 기본 기능과 다른 뭔가를이 메소드를 오버라이드 (override) 할 /해야 할 수도 있습니다

App.EmailsRoute = Ember.Route.extend({ 
    model: function(params) { 
     return [{id: 1, address: 'other@email.com'}]; 
    }, 
    setupController: function(controller, model) { 
     // here, controller is whatever controller this route needs 
     // by conventions, it knows it should be EmailsController 
     // of the type ArrayController 
     // model is whatever was returned by the model function above 

     // the content is a "bag" which can be filled with a model or any 
     // other object you need. Just keep in mind your view layer will 
     // be referring to this object later on 
     controller.set('content', model); 

     // you can set other properties of the controller here too 
     controller.set('applyFilter', true); 
    } 
}); 

fiddle

0 이제 템플릿은 컨트롤러의 데이터에 액세스 할 수 있습니다. 아래 예제는 EmailsController에있는 객체 컬렉션 ( App.Email)을 반복합니다. 이 컬렉션 또는 자식 개체의 모든 공용 속성에 액세스 여기, 하나의 예는 {{email.address}}입니다 : 템플릿이 아니라 데이터로 할당 된 content에 모델로 직접 말하는 것이 아니라 것을

가

<script type="text/x-handlebars" data-template-name="emails"> 
    <ul> 
    {{#each email in controller}} 
     <li> 
      {{#linkTo emails.email email}} 
       {{email.address}} 
      {{/linkTo}} 
     </li>  
    {{/each}} 
    </ul> 
    {{outlet}} 
</script> 

주 모델에서. 앞서 말했듯이 콘텐츠 나 모델의 모든 객체를 경로를 통해 숨길 수 있으므로 DS.Model을 사용하지 않거나 아키텍처가 강하게 결합되어 있습니다.

App.Email 유형 대신이 모델이 다른 속성을 가진 다른 유형 인 경우 여기에 액세스 할 수 있으며 제한 사항이 있습니다. 모델의 속성이 컬렉션 인 경우 색인을 통해 액세스 할 수 없습니다 (예 : {{email.messages[0].body}}). 이 경우 가장 좋은 방법은 콘트롤러에서 계산 된 속성으로, 이메일의 메시지 컬렉션의 첫 번째 항목에 직접 액세스 할 수 있습니다 (있는 경우).