如何在 Angular js 中动态设置单选按钮的选中状态

Question

我正在使用 MEAN Stack，我有一个包含无线电的表格

提交成功的按钮现在我想编辑记录。我想要的是记录单选按钮应该根据数据库值进行检查。

怎么做。

我的编辑表单是：-

 <form id = "expensesCreate" class="form-horizontal" name="myForm">
    <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Address</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                <input class="form-control input-sm" placeholder="" autocomplete="off" id="address"  name="address" ng-model="address"  type="address" value ="{{registeruser.address}}" required>
                                <p class="error" ng-show=" myForm.password.$touched && myForm.password.$error.required" >Address is required.</p>
                            </div>
                        </div>

                         <div class="form-group">
                            <label for="Phone_no" class="col-sm-3">Sex</label>
                            <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
                                Male <input type="radio"  ng-model="sex" value="Male" >
                                FeMale<input type="radio" ng-model="sex" value="Female">

                            </div>
                        </div>
</form>

如果性别是男性的特定记录到数据库中如何检查或选择男性单选按钮。

Answer 1

使用 ng-value 属性将单选按钮设置为已选中。

 ng-value="true"

Answer 2

您可以像这样在您的视图中评估 sex 属性到 truthy：

<td><input type='radio' ng-checked="p.sex=='male'"></td>
<td><input type="radio"  ng-checked="p.sex=='female'" ></td>

希望对您有所帮助。

Answer 3

<!DOCTYPE html>
<html ng-app="app">

<head>
  <script data-require="angularjs@1.5.8" data-semver="1.5.8" src="https://opensource.keycdn.com/angularjs/1.5.8/angular.min.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="myCtr">
  <form id="expensesCreate" class="form-horizontal" name="myForm">
    <div class="form-group">
      <label for="Phone_no" class="col-sm-3">Address</label>
      <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
        <input class="form-control input-sm" placeholder="" autocomplete="off" id="address" name="address" ng-model="address" type="address" value="{{registeruser.address}}" required>
        <p class="error" ng-show=" myForm.password.$touched && myForm.password.$error.required">Address is required.</p>
      </div>
    </div>

    <div class="form-group">
      <label for="Phone_no" class="col-sm-3">Sex</label>
      <div class="col-sm-4 @if($errors->has('Phone_no')) has-error @endif">
        Male
        <input type="radio" name="gender" ng-model="sex" value="male"> FeMale
        <input type="radio" name="gender" ng-model="sex" value="female">

      </div>
    </div>
  </form>
  <script>
    angular.module('app', [])
      .controller('myCtr', function($scope) {
        $scope.sex = 'female'; // Instead of this use database value here
      })
  </script>
</body>

</html>

如何在 Angular js 中动态设置单选按钮的选中状态

How to dynamically set checked state in radio button in Angular js

javascript

jquery

angularjs

mean-stack