通过编程方式改变单选按钮的状态

Angularjs - Programmatically change radio button status

本文关键字：单选按钮 状态 改变 方式 编程      更新时间：2023-09-26

在我正在开发的基于表单的应用程序中，我使用单选按钮来控制布尔值。当通过用户界面改变他们的状态时，一切都很顺利。但是，我需要在某些时候更改无线电的值(更改ng-model值)。这里我面临的问题是，单选按钮的[图形]状态没有改变，但两个单选按钮都取消了自己的选择。ng-model的值设置为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>

谢谢你的帮助!

删除两个属性上的ng-checked属性，并正确初始化value的值。控制器内的文本:

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

请参阅此处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>
相关文章：