named outlets을 정의하려면 Ember.Route#renderTemplate
을 사용하면 어떤 경로가 어떤 경로에 어떤보기/템플릿/모드/컨트롤러에 연결될 것인지 지시 할 수 있습니다. 예를
를 들어
내가 템플릿이 있다고 :
App.ApplicationController = Em.Controller.extend({
title: 'Cool App',
layout: true,
useLayout: function() {
return this.get('layout');
}.property('layout')
});
가 내가있는 콘센트에로드하고있어 어떤 템플릿을 지정할 수 있습니다 :이 같은 응용 프로그램 컨트롤러를했다
<script type="text/x-handlebars">
{{#if showTemplate}}
<h1>App</h1>
{{outlet center}}
{{outlet south}}
{{else}}
{{outlet blank}}
{{/if}}
</script>
애플리케이션 템플릿 아래 :
App.LeftRoute = Em.Route.extend({
renderTemplate: function() {
this.render('left', {
into: 'application',
outlet: 'center'
});
this.render('south', {
into: 'application',
outlet: 'south'
});
}
});
App.RightRoute = Em.Route.extend({
renderTemplate: function() {
this.render('right', {
into: 'application',
outlet: 'center'
});
}
});
이 특정 경로의 경우 controllerFor
을 통해 ApplicationController
에 layout
속성을 설정하면 응용 프로그램 서식 파일에서 다른 서식 파일을 제거하게됩니다.
App.BlankRoute = Em.Route.extend({
setupController: function(controller, model) {
var c = this.controllerFor('application');
c.set('layout', false);
},
renderTemplate: function() {
this.render('blank', {
into: 'application',
outlet: 'blank'
});
}
});
은 (fiddle 참조)이 사양으로
, "올바른 길"에, "센터"의 내용 만 표시되고 "남쪽 출구는"비어 있습니다. "빈 경로"는 템플릿 마크 업이없는 콘센트에로드됩니다.
나는 이것이 많은 노력처럼 보인다는 것을 알고있다. 그러나 이것은 단지 개념적 예일 뿐이다. 나는 그것을 향상시킬 수있을 것이라고 확신한다.