2016-04-21 69 views
1

我試圖讓一個應用程序具有一些數據驅動的用戶界面。所以,我試圖傳入一個應該在點擊按鈕時調用的函數。當然,第二個按鈕起作用,因爲它顯式調用該函數。但是,第一個沒有。 這裏的角的js代碼:如何使一個angularjs按鈕點擊調用傳入函數?

$scope.clickFunction = "clickedIt()"; 
$scope.clickedIt = function(){ 
    alert("It worked!");} 

和HTML:

<p>How can I make this button call a passed-in function?</p> 
<button ng-click="{{clickFunction}}">Click Me</button> 
<p>I'd like it to evaluate to this, which works.</p> 
<button ng-click="clickedIt()">Click Me</button> 

下面的代碼,我儘量讓工作plunker。 http://plnkr.co/edit/aRBX3bbgHCV15mgROZx1?p=preview

回答

1

您需要定義控制器,你要爲事件處理程序使用函數名稱:

$scope.clickFunction = "clickedIt"; 

然後在模板中使用括號標記:

<button ng-click="this[clickFunction]()">Click Me</button> 

的想法是,this點到當前的作用域對象,正是你想要的,這就是爲什麼括號表示法在這裏很有用。

演示:http://plnkr.co/edit/TmdGuCpnbYz3gaWDi9tB?p=preview

+0

我以前從未見過括號標記。再次敲打angularjs文檔的時間。謝謝! – wandercoder

+0

雖然您不會在Angular文檔中找到它。你只需要瞭解角度表達式基本上被解析和評估,就像javascript一樣。而javascript有這個功能:你可以使用括號表示訪問對象屬性:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors#Bracket_notation – dfsq

相關問題