单击表格行以触发复选框单击Angularjs
我在Angularjs应用程序中有一个简单的表,每行包含一个复选框单击表格行以触发复选框单击Angularjs,angularjs,checkbox,triggers,html-table,row,Angularjs,Checkbox,Triggers,Html Table,Row,我在Angularjs应用程序中有一个简单的表,每行包含一个复选框 <table> <tr ng-repeat="obj in objList"> <td> <input type="checkbox" ng-model="selectedObjs" value="{{obj}}" ng-checked="obj.selected"
<table>
<tr ng-repeat="obj in objList">
<td>
<input type="checkbox" ng-model="selectedObjs" value="{{obj}}"
ng-checked="obj.selected"
ng-click="toggleObjSelection(obj.description)">
{{obj.description}}
</input>
</td>
</tr>
</table>
{{obj.description}}
Angularjs中是否有一种方法允许用户单击行中的任何位置以触发复选框单击一次
如果用户在复选框中单击,我们不希望触发该单击,使其看起来复选框单击被触发了两次
本文()介绍了如何在jQuery中实现这一点,但有没有一种方法可以使用Angularjs样式实现这一点?您已经非常接近了,只需停止$event对象上的复制操作:
<table ng-controller="ctrl">
<tr ng-click="rowClicked(obj)" ng-repeat="obj in objList">
<td>
<input type="checkbox" ng-model="selectedObjs" value="{{obj}}"
ng-checked="obj.selected"
ng-click="toggleObjSelection($event, obj.description)">
{{obj.description}}
</input>
</td>
</tr>
</table>
相关问题:您可以使用delegate此功能运行良好,除了在函数
$scope.rowClicked()
I changedobj.selected=true代码>至obj.selected=!对象选择代码>。很高兴它起作用了,我批准了你的编辑——很有意义。你能接受这个答案吗?
angular.module('myApp', [])
.controller('ctrl', function($scope) {
$scope.objList = [{
description: 'a'
},{
description: 'b'
},{
description: 'c'
},{
description: 'd'
}];
$scope.toggleObjSelection = function($event, description) {
$event.stopPropagation();
console.log('checkbox clicked');
}
$scope.rowClicked = function(obj) {
console.log('row clicked');
obj.selected = !obj.selected;
};
});