将操作发送到EmberJS中的应用程序控制器

时间:2016-08-02 17:43:08

标签: ember.js

我正在尝试通过单击其中一个模板上的按钮来切换应用程序控制器上的全局属性。我已经阅读了一些关于动作冒泡的内容,但无法工作。

这是应用程序控制器上的属性和操作

export default Ember.Controller.extend({
  isAuthenticated: true,
  actions: {
    logIn: function(){
      this.toggleProperty('isAuthenticated');
    }
  }
});

这是使用login.hbs模板文件的动作(我很快就会把它变成一个合适的按钮)

<span {{action 'logIn'}}>
    {{#link-to 'boards' class="btn-l bg-blue white db mtl link bn w-100"}}Login{{/link-to}}
</span> 

如何确保操作切换应用程序控制器上的属性?

1 个答案:

答案 0 :(得分:2)

在登录控制器中,您需要注入应用程序控制器。

 import Ember from 'ember';

 export default Ember.Controller.extend({  
   appCont:Ember.inject.controller('application')
 });

并且在login.hbs中,您需要指定哪个目标将接收方法调用。

<button {{action 'logIn' target=appCont}}> Login </button>

在此<button {{action 'logIn'}}> Login </button>中,模板的上下文是登录控制器,当登录控制器未实现指定的操作时,以这种方式使用的操作将冒泡到登录路由。一旦某个动作到达登录路线,它就会在路径层次结构中冒泡。

参考:http://emberjs.com/api/classes/Ember.Templates.helpers.html#toc_specifying-a-target

编辑:如果您想调用Controller组件内的Component then you need to pass actions to中可用的功能

  

Login.hbs

{{component-a logIn=(action 'logIn') }}
  

组件a.hbs

<button {{action (action logIn)}}> LogIn</button>