如何通過ng-click / ng-change將單選按鈕標記為Angular中的選中狀態？

Question

http://plnkr.co/edit/rXWUUjLtJi79z2hF1uVX?p=預覽

我有一個非常簡單的plnkr，基本上，當單擊li元素時，我希望選中單選按鈕。

下面如何完成？ 現在，沒有無線電被選中。

如果刪除ng-click，則用戶只需單擊單選按鈕，但是如果用戶單擊li內的文本/標簽，我也希望選擇單選按鈕，這就是為什么我嘗試獲取ng-click li以這種方式工作。

 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>

Answer 1

對於此示例，我不會使用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>

如何通過ng-click / ng-change將單選按鈕標記為Angular中的選中狀態？

問題描述

1 個解決方案

解決方案1
3 已采納 2015-05-20 16:31:36

如何通過ng-click / ng-change將單選按鈕標記為Angular中的選中狀態？

問題描述

1 個解決方案

解決方案1 3 已采納 2015-05-20 16:31:36

解決方案1
3 已采納 2015-05-20 16:31:36