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

I am working with MEAN Stack and I have a form which is included radio

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

Button which is submitted successfully Now what I want is to edit the record. I want is that the record radio button should be checked according to database value.

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

How to do that.

怎么做。

my edit form is:-

我的编辑表格是: -

 <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>

if sex is male of a particular record into database how to checked or selected male radio button.

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

3 个解决方案

#1

You can evaluate the sex property to truthy in your view like so:

你可以在你的视图中评估性别属性,如下所示:

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

Hope it helps.

希望能帮助到你。

#2

Use ng-value property to set the radio button as checked.

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

 ng-value="true"

#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>

#1