Question

我想使用angularjs填充一对Yes或No单选按钮。我在$ scope中执行此操作的单个值称为x.employed。 x.employed有三个可能的值null，＆＃39; true＆＃39;并且＆＃39; false＆＃39;。如何使单选按钮显示x.employed的值，然后从用户收集任何后续更改。

<div class="container" ng-repeat="x in FormList" >
<div class="form-group">
    <input type="radio" ng-value="x.employed" ng-model="new.employed" /> Yes &nbsp;
    <input type="radio" ng-value="x.employed" ng-model="new.employed" /> No
</div>

我也尝试过检查，但据我所知它不能与ng-model一起使用。这让我完全糊涂了，任何人都可以对我如何做到这一点有所了解吗？

Answer 1

你有几个问题。首先，需要将值（或ng值）设置为与按钮关联的值，是或否。其次，应将ng-model设置为对象中的属性。

＆＃13;

var app = angular.module('sample', []);

app.controller('MainCtrl', function($scope) {
  $scope.FormList = [{
    employed: 'true'
  }, {
    employed: 'false'
  }, {
    employed: null
  }];
});

＆＃13;

<html ng-app="sample">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Sample</title>
  <script data-require="jquery@2.2.4" data-semver="2.2.4" src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  <link data-require="bootstrap@3.3.7" data-semver="3.3.7" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" />
  <script data-require="bootstrap@3.3.7" data-semver="3.3.7" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script>
    document.write('<base href="' + document.location + '" />');
  </script>
  <script data-require="angular.js@1.5.x" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.11/angular.min.js" data-semver="1.5.11"></script>
</head>

<body ng-controller="MainCtrl">
  <div class="container" ng-repeat="x in FormList">
    <div class="form-group">
      <input type="radio" ng-value="'true'" ng-model="x.employed" /> Yes
      <input type="radio" ng-value="'false'" ng-model="x.employed" /> No
    </div>
  </div>
</body>

</html>

＆＃13;

如何在范围内的变量中填充angularjs中的单选按钮，并将任何更改收集到范围中

1 个答案: