Question

在我开发的基于表单的应用程序上，我可以使用单选按钮来控制布尔值。通过用户界面更改状态时一切顺利。但是，我需要在某个时刻更改无线电的值（更改ng-model值）。在这里，我面临的问题是单选按钮的[图形]状态不会改变，但两个无线电都会取消选择。 ng模型的值设置为ok。

这是我使用的HTML代码：

<div class="radio-inline">
<label> <input type="radio" name="optionsRadios"
    ng-value="true" ng-model="value.text" ng-checked="value.text">
    Active
</label>
</div>
<div class="radio-inline">
    <label> <input type="radio" name="optionsRadios"
        ng-value="false" ng-model="value.text"
        ng-checked="!value.text"> Inactive
    </label>
</div>

感谢您的帮助！

Answer 1

删除两个属性上的ng-checked属性并正确初始化控制器中value.text的值：

var app = angular.module('app').
controller('DemoCtrl', function($scope) {
 $scope.value = {};
 $scope.value.text = false;
});

Answer 2

请参阅此处http://jsbin.com/catih/1/edit

JS

var app = angular.module('app', []);

app.controller('firstCtrl', function($scope){

 $scope.value = {
   text : false
 };
  $scope.activate = function()
 {

   $scope.value.text = true;

 };

});

HTML：

<body ng-app="app">
  <div ng-controller="firstCtrl">

    <button ng-click="activate()">Activate</button>

  <div class="radio-inline">
<label> 
  <input type="radio" name="optionsRadios"
    ng-value="true" ng-model="value.text"  >
    Active
</label>
</div>
<div class="radio-inline">
    <label> <input type="radio" name="optionsRadios"
        ng-value="false" ng-model="value.text"
        > Inactive
    </label>
</div>
      </div>
</body>

Angularjs - 以编程方式更改单选按钮状态

2 个答案: