[英]AngularJS - Bind click event to element
我将以下部分插入到ng-view中。 我只粘贴部分相关的部分。
<tr ng-repeat="group in groups">
<td><a href="" class="restaurant-group-edit" create-link>{{ group.name }}</a></td>
<td>{{ group.members.length }}</td>
<td>{{ 5 }}</td>
<td style="text-align: right">
<span class="pseudo-select enhanced-select ps-settings">
<select class="enhanced-select ps-settings restaurant-group-select" restaurant_group_id="1">
<option value="actions">Actions</option>
<option value="edit">Edit</option>
<option value="edit">Restaurants</option>
<option value="delete">Menus</option>
<option value="edit">Delete</option>
</select>
<span class="es-label">Actions</span>
<span class="icon"></span>
</span>
</td>
</tr>
我想将click事件绑定到上面的每个锚元素。 我已经尝试过使用名为create-link的自定义指令进行此操作。 在我的app.js文件中,我有以下代码。
adminApp.directive("create-link", function($location, $timeout, $rootScope) {
console.log("I fired the directive!");
return {
restrict: "A",
link: function(scope, element) {
$timeout(function(){
element.on("click", function(e) {
console.log("Clicked!");
});
});
}
};
});
但是,该事件从未绑定。 实际上,“我解雇了指令!” 从未真正写入控制台。 我在这里想念什么? 将事件绑定到在加载视图时创建的DOM元素似乎是一种常见的用例。 当然,有一种简单的方法可以做到这一点。
谢谢你的帮助。
安德鲁
将js中的指令名称更改为在视图部分中声明的指令名称的驼峰式版本:
adminApp.directive("createLink", function($location, $timeout, $rootScope) {
console.log("I fired the directive!");
return {
restrict: "A",
link: function(scope, element) {
$timeout(function(){
element.on("click", function(e) {
console.log("Clicked!");
});
});
}
};
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.