如何在angularjs中选择单选按钮

Question

我是angularjs和javascript的新手，我有一个单选按钮列表并且必须选择其中一些，所以anybuddy可以告诉我如何实现这一点吗？我试过 ng-value = true < / strong>没有运气，我的代码如下：

<ons-list-item modifier="tappable"  ng-repeat="area in vm.AreaList" >
    <label class="radio-button radio-button--list-item line-h45">
        <input type="radio"  ng-bind="area.name"  ng-model="vm.selectedArea" name="area" ng-value="area.code" >
        <div class="radio-button__checkmark radio-button--list-item__checkmark">

        </div>
        {{area.name}}
    </label>
</ons-list-item>

Answer 1

你可以在你的控制器中做这样的事情：

 $scope.results = {
      favorites: [{
        id: "WatchList1",
        title: "WatchList1"
      }, {
        id: "WatchList2",
        title: "WatchList2"
      }, {
        id: "WatchList3",
        title: "WatchList3"
      }]
    };

$scope.selectedRow = {
  id: 'WatchList2'
};

$scope.event = {
  type: {
      checked: true
  }
}

和你的html：

<div>
  <div ng-repeat="row in results.favorites">
  <input type="radio" ng-model="selectedRow.id" value="{{ row.id }}" style="opacity: 1;" class="pointer" />
  <span>{{ row.title }}</span>
  </div>
</div>

  单盒

Answer 2

您应该使用ngChecked。

https://docs.angularjs.org/api/ng/directive/ngChecked

    <ons-list-item modifier="tappable"  ng-repeat="area in vm.AreaList" >
        <label class="radio-button radio-button--list-item line-h45">
            <input type="radio"  ng-bind="area.name"  ng-model="vm.selectedArea" name="area" ng-value="area.code" 
                 ng-checked="true">
            <div class="radio-button__checkmark radio-button--list-item__checkmark">
            </div>
            {{area.name}}
        </label>
    </ons-list-item>

Answer 3

一次只能选择一个单选按钮。

如果您想要多个选定项目，请使用复选框并选择，使模型值等于值属性。