2013-04-10 7 views
1

모든 페이지에 포함 된 오디오 플레이어, 모바일 서랍, 머리글 등이 포함 된 매우 복잡한 응용 프로그램 템플릿이있는 엠버 응용 프로그램이 있습니다.Ember.js에 nil 레이아웃과 동일한 기능이 있습니까?

내 로그인 페이지에는 이러한 템플릿이없는 자체 템플릿이 있어야합니다. 루비에서는 단순히 응용 프로그램 템플릿을 사용하지 않으려면 layout => nil을 수행 할 수 있지만이 작업을 수행 할 수있는 방법은 찾을 수 없습니다.

나는이 페이지에서 사용하지 않는 모든 요소를 ​​숨기고 싶지 않으며 모든 다른 페이지에 해당 요소를 명시 적으로 포함시키고 싶지도 않습니다. 어떤 제안?

답변

1

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을 통해 ApplicationControllerlayout 속성을 설정하면 응용 프로그램 서식 파일에서 다른 서식 파일을 제거하게됩니다.

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 참조)이 사양으로

, "올바른 길"에, "센터"의 내용 만 표시되고 "남쪽 출구는"비어 있습니다. "빈 경로"는 템플릿 마크 업이없는 콘센트에로드됩니다.

나는 이것이 많은 노력처럼 보인다는 것을 알고있다. 그러나 이것은 단지 개념적 예일 뿐이다. 나는 그것을 향상시킬 수있을 것이라고 확신한다.

관련 문제