将控制器操作传递给EmberJS中的组件返回undefined

时间:2015-12-07 16:29:56

标签: javascript ember.js

我在EmberJS中有一个带有动作的控制器,在路径模板中我正在调用一个组件,并将控制器的动作作为参数传递给组件。就像文档在EmberJS 2.20 Triggering changes with actions中所说的那样 当我试图在组件内调用"parent"动作时,返回是未定义的,但如果我抛出控制台,"this"元素并检查其attr,则该函数就在那里。
控制器js代码:

export default Ember.Controller.extend({
  firstName:'',
  lastName:'',
  actions: {
    addAlumn (){
      this.store.createRecord('alumn',{
        firstName : this.get('firstName'),
        lastName : this.get('lastName')
      });
    }
  }
});

路由hbs模板:

{{#validated-form submit=(action 'addAlumn') saveBtn=true }} ... {{/validated-form}}

验证格式的hbs模板

{{yield}}
{{#if saveBtn}}
<a href="#" class="btn primary save"{{action "validateAndSubmit"}}>Add <span class="icon-check"></span></a>
{{/if}}

验证表单js代码

export default Ember.Component.extend({
  actions : {
    validateAndSubmit(){
      console.log('validate');
      console.log(this);
      console.log(this.get('submit')());
    }
  }
});

正如我所说,控制台上的结果是:

> validate
> Class {__ember1449505261281: "ember496", __ember_meta__: Meta, parentView: Class, HAS_BLOCK [id=__ember1449505261281400801945202]: true, _targetObject: Class…}
> undefined

有关为何没有触发事件的任何线索?也许是因为指南示例只使用组件而我正在使用控制器?

1 个答案:

答案 0 :(得分:0)

请使用componentInstance.sendAction

validateAndSubmit() {
  console.log('validate');
  this.sendAction('submit');
}

Working demo.