angulaire.js - Comment utiliser angulaire pour rendre la case à cocher unique afin qu'une seule puisse être sélectionnée?

Question

Comment utiliser angulaire pour rendre la case à cocher unique afin qu'une seule puisse être sélectionnée ?

Comme le montre l'image, voici les options des cases à cocher dans le tableau :

<td width="30" style="text-align: left"><input
                            type="checkbox" ng-model="checkboxes.items[item.bookingId]" name="flag" ng-click="updateSelection(item.bookingId,checkboxes.items)"/></td>

S'il est implémenté dans le contrôleur de l'objet, il ne peut être sélectionné qu'en une seule fois. Et si vous en sélectionniez un ? ?

Answer 1

la case à cocher est une case à cocher, veuillez utiliser la radio

pour une sélection unique

Answer 2

Essayez celui-ci

<p ng-controller="MyCtrl">
    <p ng-repeat="item in list">
        <label><input type="checkbox" ng-model="item.checked" ng-change="onChange(item)">{{item.name}}</label>
    </p>
</p>

.controller('MyCtrl', function ($scope) {
    $scope.selected = '';
    $scope.list = [
        {id: 1, name: 'xxx'},
        {id: 2, name: 'yyy'},
        {id: 3, name: 'zzz'}
    ];

    $scope.onChange = function (item) {
        if (item.checked) {
            if (!$scope.selected) $scope.selected = item;
            if ($scope.selected !== item) item.checked = false;
        } else {
            $scope.selected = '';
        }
    }
});