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');   
}