Ember.js 在控制器之间访问和更改变量答案

【问题标题】：Ember.js accessing and changing variables between controllersEmber.js 在控制器之间访问和更改变量
【发布时间】：2013-08-22 16:17:04
【问题描述】：

我正在尝试使用 ember 编写登录/注销小部件。我想切换 isLoggedIn 属性，以便在用户注销时将其设置为 False，并且在用户登录时设置为 True。isLoggedIn 在我的应用程序控制器中定义，并在我的应用程序模板中使用把手调用。现在，我需要在用户成功登录并且在 LoginController 内部激活登录功能时将 isLoggedIn 的值设置为 true - 并在用户单击注销时注销。所以我的问题是：如何让 LoginController 和应用程序控制器相互访问并更改其中的变量。

以下是应用程序模板中的一些代码：

    <section class="top-bar-section">
        <!-- Right Nav Section -->
        <ul class="right">
            ...
            {{#if isLoggedIn}}
            <li><a href="#" {{ action "logout" }}>Logout</a></li>
            {{else}}
            <li>
            {{#linkTo "login"}}Login{{/linkTo}} </li>
            {{/if}}
        </ul>
    </section>
</nav>
{{outlet}}

应用程序控制器：

var App;

App = require('app');

module.exports = App.ApplicationController = Ember.ObjectController.extend({
    isLoggedIn: false,

    logout: function(){
        this.set("isLoggedIn", false);
        console.log(this.token);
    }
});

登录模板：

...
<form class="form-horizontal" {{action "login" on="submit"}}>
    ...
<div class="row">
    <div class="large-5 columns">
        <label>Username</label>
          {{input value=username type="text" placeholder="Username"}}
    </div>
    <div class="large-5 columns">
        <label>Password</label>
         {{input value=password type="password" placeholder="Password"}}
    </div>
    <div class="large-2 columns">
    </br>
    {{input class="small button" type="submit" value="Log In"}}
    </div>
</div>
</form>
 {{#if errorMessage}}
        <div class="large-12 columns alert-box alert">{{errorMessage}}</div>
      {{/if}}
    {{/if}}

登录控制器：

var App;

App = require('app');

module.exports = App.LoginController = Ember.ObjectController.extend({
    //some variables...

    //other functions...

    login: function() {
        // set isLoggedIn to true here
     ...}

});

最初导航栏会看到 isLoggedIn 为假，因此显示登录。成功登录并单击提交后，将触发一个操作并激活 LoginController 内的 login()。这就是我想将 isLoggedIn 设置为 true 的地方，这样 Logout 就会出现在导航栏上。

【问题讨论】：

标签： ember.js

【解决方案1】：

你试过了吗：

module.exports = App.LoginController = Ember.ObjectController.extend({
    needs: ['application']
    login: function() {
        if (authentification sucess) {
             this.set('controllers.application.isLoggedIn', true);
        } else {
             this.set('controllers.application.isLoggedIn', false);
        }            
    }
});

要访问其他控制器实例，请使用 needs 属性。每个指定的控制器都将被注入到controllers 属性中。所以needs: ['application']，将应用控制器注入controllers.applicaiton。

【讨论】：