http://plnkr.co/edit/rXWUUjLtJi79z2hF1uVX?p=preview
我有一个非常简单的 plnkr，基本上当单击 li 元素时，我希望检查单选按钮。
下面这是如何实现的？现在没有选择任何 radio 。
如果我删除 ng-click，那么用户只需单击单选按钮，但如果用户单击 li 内的文本/标签，我也希望选择单选按钮，其中这就是为什么我试图让 li 上的 ng-click 以这种方式工作。
angular.module('app', [])
.controller('mainController', ['$scope', '$rootScope',
function($scope,$rootScope) {
$scope.toggleTags = function(type) {
console.log(type);
switch(type) {
case 'watchlist':
$scope.watchlist = true;
$scope.private = false;
break;
case 'private':
$scope.watchlist = false;
$scope.private = true;
break;
}
};
}]);body { font-family: Arial, sans-serif; }
li {
margin: 10px;
list-style: none;
width: 100%;
clear: both;
cursor: pointer;
}<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app" ng-controller="mainController">
<ul>
<li ng-click="toggleTags('watchlist')">
<input type="radio"
name="personalGroup"
ng-model="watchlist"
ng-change="toggleTags('watchlist')"
value="watchlist">
My Watchlist
</li>
<li ng-click="toggleTags('private')">
<input type="radio"
name="personalGroup"
ng-model="private"
ng-change="toggleTags('private')"
value="private">
My Private Tags
</li>
</ul>
</body>最佳答案
对于这个例子，我不会使用 ng-click去做这个。相反，我会使用 HTML DOM 对象 <label for="radio_button_id_here"> .
HTML
<li>
<input type="radio" name="personalGroup" ng-model="watchlist" value="watchlist" id="watchlist">
<label for="watchlist">My Watchlist</label>
</li>
<li>
<input type="radio" name="personalGroup" ng-model="private" value="private" id="private">
<label for="private">My Private Tags</label>
</li>关于javascript - 如何使用 ng-click/ng-change 在 Angular 中将单选按钮标记为已选中？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30355322/