我在
Angularjs应用程序中有一个简单的表,每个行都包含一个复选框.
<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>
Angularjs中是否有一种方法允许用户单击行中的任何位置以触发复选框单击一次？
如果用户单击复选框,我们不希望触发单击,以便显示复选框单击被触发两次.
这篇文章(http://www.learningjquery.com/2008/12/quick-tip-click-table-row-to-trigger-a-checkbox-click/)描述了如何在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>
和JS：
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;
};
});
