リンク関数で、関数をクリックイベントにバインドするためのより「角度のある」方法はありますか？
今、やってます...
myApp.directive('clickme', function() {
return function(scope, element, attrs) {
scope.clickingCallback = function() {alert('clicked!')};
element.bind('click', scope.clickingCallback);
} });
これはAngularのやり方ですか、それとも醜いハックですか？おそらく私はそれほど心配する必要はありませんが、私はこのフレームワークに不慣れであり、特にフレームワークが前進するにつれて、物事を行うための「正しい」方法を知りたいと思います。
ディレクティブでコントローラーを使用できます。
angular.module('app', [])
.directive('appClick', function(){
return {
restrict: 'A',
scope: true,
template: '<button ng-click="click()">Click me</button> Clicked {{clicked}} times',
controller: function($scope, $element){
$scope.clicked = 0;
$scope.click = function(){
$scope.clicked++
}
}
}
});
Angularガイドのディレクティブの詳細。そして、私にとって非常に役に立ったのは、これらのディレクティブについての公式のAngularブログ投稿からのビデオでした。
多くの人がこのようにやっているのを見てきましたので、大丈夫だと思います。
ただし、ディレクティブ内でイベントハンドラーを定義するだけの場合は、スコープで定義する必要はありません。以下は問題ありません。
myApp.directive('clickme', function() {
return function(scope, element, attrs) {
var clickingCallback = function() {
alert('clicked!')
};
element.bind('click', clickingCallback);
}
});
単純にすべきではありません：
<button ng-click="clickingCallback()">Click me<button>
クリックイベントをスコープのコールバックにマップするためだけに新しいディレクティブを作成するのはなぜですか？ng-clickはすでにそれを行っています。
以前の回答で提案されているように、ディレクティブでコントローラーを使用し、テンプレートhtmlでng-クリックする必要があります。ただし、ボタンのクリックなど、イベント（クリック）時にDOM操作を行う必要がある場合は、ボタンの色などを変更してから、Link関数を使用し、要素を使用してDOMを操作します。
HTML要素またはそのような非dom操作タスクに値を表示するだけの場合は、ディレクティブは不要であり、コントローラーを直接使用できます。
この場合、ディレクティブは必要ありません。これは仕事をします：
<button ng-click="count = count + 1" ng-init="count=0">
Increment
</button>
<span>
count: {{count}}
</span>
myApp.directive("clickme",function(){
return function(scope,element,attrs){
element.bind("mousedown",function(){
<<call the Controller function>>
scope.loadEditfrm(attrs.edtbtn);
});
};
});
これは、属性clickmeのonclickイベントとして機能します