AngularJs. Можно ли отменить выбор HTML "радио" нажатием кнопки?

У меня есть радиовходы и вы хотите, чтобы состояние ucheck щелкнуло по радио, если текущее радио проверено.

Этот код:

<input type="radio" id="average_0" name="average" ng-model="checked" ng-change="false" value="500" class="ng-valid ng-dirty">
<input type="radio" id="average_1" name="average" ng-model="checked" ng-change="false" value="1000" class="ng-valid ng-dirty">
<input type="radio" id="average_2" name="average" ng-model="checked" ng-change="false" value="1500" class="ng-valid ng-dirty">

Не работает.

Fiddle: http://jsfiddle.net/Zoomer/8s4m2e5e/

Ответы

Ответ 1

Радиокнопки могут быть выбраны только по одному и не могут быть отключены пользователем после их проверки (если вы не программно). Поэтому, если вы хотите снять флажок, когда он выбран в данный момент, вы можете сделать это:

<input type="radio" ng-model="checked" value="500" ng-click="uncheck($event)" />
<input type="radio" ng-model="checked" value="1000" ng-click="uncheck($event)" />
<input type="radio" ng-model="checked" value="1500" ng-click="uncheck($event)" />

В вашем контроллере:

$scope.uncheck = function (event) {
    if ($scope.checked == event.target.value)
        $scope.checked = false
}

DEMO: http://jsfiddle.net/8s4m2e5e/3/

ПРИМЕЧАНИЕ. Если вы действительно хотите выбрать один или несколько вариантов из многих вариантов, вы можете выбрать <select>

Ответ 2

Простым решением, которое работает на Angular 1.3+, является:

Шаблон

<input type="radio" ng-model="forms.selected" value="{{value}}" ng-click="radioCheckUncheck($event)">

контроллер

  let lastChecked = null
  $scope.radioCheckUncheck = function (event) {
    if (event.target.value === lastChecked) {
      delete $scope.forms.selected
      lastChecked = null
    } else {
      lastChecked = event.target.value
    }
  }

Он похож на вышеупомянутое решение, но сохраняет свою собственную копию предыдущего выбора.

Ответ 3

Я решил проблему со следующим кодом:

ng-dblclick = "{{model}} = '' "

Ответ 4

Более простым решением является добавление:

ng-dblclick = "checked = null"