Ember.js布局

Question

我刚刚对ember.js感到满意，并希望使用它创建一个单页应用程序。 由于应用程序的性质，在某些时候我将有多个“主要”布局。

用户登录到应用程序后，我需要基于ajax调用显示用户名。 我还不了解如何在ember.js中最好地实现这一点，因为（至少对我而言）这不在任何视图层次结构之内。

我使用了render方法的“ into”选项。

App.TestRoute = Ember.Route.extend({
  renderTemplate: function(controller, model) {
    this.render('layout');

    this.render('test',{
       into: 'layout'
    });
  },
});

我认为这也会调用布局路线并加载其模型。 不幸的是它没有那样做。

我用{{yield}}指令定义了一个布局

<div>
  <div class="container" id="header">
    {{loginUser.userName}}
  </div>

  <div class="container" id="main-content">
    {{yield}}
  </div>

  <div class="container" id="footer">
    Just some static footer
   </div>
</div>

我的看法像

App.TestView = Ember.View.extend({
  layoutName: 'layout'
});

渲染工作正常，但是我看不到可以最好地注入用户数据的位置。 理想情况下，这对于使用此布局的所有视图应该是透明的。 所以我的想法是使用继承，但是还没有找到可行的解决方案。

我在这里完全偏离轨道吗，或者这在某种程度上有意义？

UPDATE

我将示例放在这里： http : //jsfiddle.net/Efz8N/4/

Answer 1

布局由控制器支持，该控制器使用布局支持视图。

http://jsfiddle.net/WHvCZ/

loginUserFullName:function(){
    return this.get('controllers.application.loginUser') || 'not in';
}.property('controllers.application.loginUser')

Answer 2

这就是我现在的做法。 我创建了一个混合器，可以在任何使用布局的控制器中使用。 这样，我至少不必多次执行此操作：

App.LayoutHandler = Ember.Mixin.create({
  loginUserFullName: function() {
    var name = App.get("loginUser")?App.get("loginUser"):"";

    return name;
  }.property("App.loginUser"),
});

App.IndexController = Ember.Controller.extend(App.LayoutHandler, {

});

下面是一个示例： http : //jsfiddle.net/Efz8N/6/