ember.js - 向 EmberJS 中的应用程序 Controller 发送操作

Question

我试图通过单击其中一个模板上的按钮来切换应用程序 Controller 上的全局属性。我已经阅读了一些关于 Action 冒泡的内容，但无法正常工作。

这是应用程序 Controller 的属性和操作

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> 

我如何确保操作切换应用程序 Controller 上的属性？

Answer 1

在您的登录 Controller 中，您需要注入(inject)应用程序 Controller 。

 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> ，模板的上下文是登录 Controller ，当登录 Controller 没有实现指定的 Action 时，这种方式使用的 Action 将冒泡到登录路由。一旦操作命中登录路由，它将在路由层次结构中冒泡。

引用: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') }}

component-a.hbs

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