Question

我尝试将类属性绑定到由控制器创建的变量，但是当变量更改时，模板不会相应地更新。

这是我的模板片段：

<div class="collapse navbar-collapse navbar-ex1-collapse">
        <ul class="nav navbar-nav navbar-right">
            <li {{bind-attr class="loggedIn:show:hide :dropdown" }}>
                <a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-user fa-lg"></i></a>
                <ul class="dropdown-menu">
                    <li>{{#link-to 'profile'}}Profile{{/link-to}}</li>
                    <li><a href="#">Log out</a></li>
                </ul>
            </li>

变量是loggedIn，如果为true则显示此列表，否则隐藏它。该模板称为Auth

这是我的Auth控制器：

App.AuthController =  Ember.Controller.extend({
    loggedIn: false,
    actions: {
        activateProfile: function(state){
            console.log(state);
            this.set('loggedIn', true);
        }
    }
});

我有一个登录控制器，它会触发Auth中的activateProfile操作，从而更改变量并显示<li>但不知道它是否按预期工作。

这是我的登录控制器。

App.SigninController = Ember.Controller.extend({
    needs:"Auth",
    actions: {
        userQuery: function() {
                //this will be replace with call to the server
                this.get('controllers.Auth').send('activateProfile', true);
        }
    }
});

路线：

  this.resource('auth',function(){
      this.resource('profile');
      this.resource('signin');
      this.resource('signup');
  });

我尝试登录控制台和ember属性，loggedIn变量确实得到了更改，但<li>没有出现。如果你有更好的建议请教我，我做得还不够。

由于

Answer 1

我正在回答我自己的问题，万一有人遇到同样的问题。我没有使用Auth资源，而是将逻辑移到IndexController，并在IndexController中声明loggedIn。如果您使用控制器A来更改/操作控制器B的变量，我会注意到一件事，您可能能够修改其内容，但控制器B的模板不能正确地知道和更新。

为了解决这个问题，你必须使用observer或compute作为别名。正如我所提到的，我将变量移动到IndexController，因为更有意义的是整个应用程序而不仅仅是Auth模块应该知道用户状态。

以下是我修复它的方法。

App.IndexController = Ember.Controller.extend({
    loggedIn: false,
    actions:{
        loggedOut : function(){
            this.set('loggedIn', false);
            this.transitionToRoute('Index');
        }
    }
});

App.SigninController = Ember.Controller.extend({
    needs: ['Index'],
    isLoggingIn : Ember.computed.alias("controllers.Index.loggedIn"),
    actions: {
        userQuery: function() {
            this.set('isLoggingIn',true)
}
});

当然，我将Auth的模板移动为索引，而不是更改名称，这就是我需要做的全部。

希望它有所帮助！

ember模板不会更新属性变量更改

1 个答案: