Ember _如何从组件控制器访问控制器动作

Question

我试图给一个支持组件添加一些outter功能。该组件是以下之一：

应用/模板/ programmers.hbs

{{echo-hlabel-tf 
    id= "id-test-hlabel" 
    class="class-test-hlabel-mio" 
    label="Horizontal textfield" 
    textValue="..." 
    regExp="^([a-z0-9]{5})$" 
    errorMsg="Text hasn't five characters" 
    fnActionButtonClicked = "sayHello" 
}} 

我与参数玩 'fnActionButtonClicked'。这个参数代表一个被执行的函数，它不在组件的功能范围内（比如传递一个javascript函数作为参数）。我是新手，我不确切地知道这样做的余烬。组件的模板是：

应用程序/模板/组件/回波hlabel-tf.hbs

<div id="echo-hlabel-tf"> 
    <span id="{{id}}-echo-hlabel-tf-label" 
      class="{{class}}-echo-hlabel-tf-hlabel"> 
    {{label}} 
</span> 
<span id="{{id}}-echo-hlabel-tf-value" 
     class="{{class}}-echo-hlabel-tf-value"> 
    {{input id='input-id' class='input-class' value=textValue 
      focus-out = (action 'validateRegExp' textValue regExp) 
    }} 
</span> 
<span id="{{id}}-echo-hlabel-tf-error-msg" 
class="{{class}}-echo-hlabel-tf-error-msg"> 
    <p id='error-msg' class="error-msg"> 
     {{errorMsg}} 
    </p> 
</span> 

<div> 
    <h2>Testing passing functions to the component</h2> 
     <input type="button" {{action "actionButtonClicked"}}/> 
</div> 
</div> 

正如可以看到，在模板的底部，有一个输入类型= “按钮”，它与“actionButtonClicked”绑定。组件的控制器是：

应用/组件/回波hlabel-tf.js

import Ember from 'ember'; 

export default Ember.Component.extend({ 
    classNameBindings:['error'], 
    error:false, 

    actions: { 
    validateRegExp(text,regExpStr,event){ 
     let regExpObj = new RegExp(regExpStr) 
     if(regExpObj.test(text)){ 
      this.set('error',false); 
     }else{ 
      this.set('error',true); 
     } 
    }, 
    actionButtonClicked(){ 
     console.log('Arrives to the component'); 
     var action = this.get('fnActionButtonClicked'); 
     console.log(action); 
     // How can I call the function in another controller 
     // With parameter fnActionButtonClicked name 
    } 
} 
}); 

因此，模板'fnActionButtonClicked'（SayHello的）的参数将在被检索actionButtonClicked（） via var action = this.get（'fnActionButtonClicked'）;。

因此，在这一点上，怀疑。由于我无法将javascript函数作为模板参数传递（或者至少我认为这不是正确的做法），我创建了一个控制器'sampleController'来创建动作'sayHello'（参见参数fnActionButtonClicked值）用以下代码：

应用程序/控制器/采样controller.js

进口灰烬从 '余烬';

export default Ember.Controller.extend({ 
    actions:{ 
    sayHello(){ 
     console.log("I'm saying hello this time"); 
    } 
    } 

}）;

我怎样才能从应用/组件/回波hlabel-tf.js：actionButtonClicked（）执行的应用程序/控制器/采样controller.js的代码：sayHello的（）？我如何从组件控制器访问另一个控制器？这是实现我的目标的正确方式吗？

在此先感谢

Answer 1

取而代之的样品controller.js，您需要为特定的路线programmers创建控制器。所以创建app/controllers/programmers.js文件，

export default Ember.Controller.extend({ 
    actions:{ 
    sayHello(){ 
     console.log("I'm saying hello this time"); 
    } 
    } 
}) 

和组件app/components/echo-hlabel-tf.js内。

actionButtonClicked(){ 
    console.log('Arrives to the component'); 
    this.sendAction('fnActionButtonClicked');   
}