0

我正在尝试在我的应用程序中使用此Angularjs 示例页面中的示例代码进行输入 [radio]。我选择使用一个对象作为特定单选按钮的值，因此组中的每个单选按钮都有某个对象的值。

在plunkr 示例中，如果您将模型设置为绿色，即：

$scope.color = {
  name: 'green'
};

默认情况下不选中正确的单选按钮。我认为这是因为这个单选按钮的值是一个对象。

任何想法如何使它工作？如果它的值是一个对象，我如何检查正确的单选按钮？

4

2 回答 2

0

您需要将模型引用到指令$scope.color.name中定义的“绿色”对象：ngValue

$scope.specialValue = {
  id: '12345',
  value: 'green'
};

$scope.color = {
  name: $scope.specialValue
};

因为它的ngValue指令是必然的specialValue

<label>
  <input type="radio" ng-model="color.name" ng-value="specialValue">
  Green
</label>

这是一个工作示例。

于 2017-05-20T17:21:50.963 回答
0 

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-radio-input-directive-production</title>
  

  <script src="//code.angularjs.org/snapshot/angular.min.js"></script>
  

  
</head>
<body ng-app="radioExample">
  <script>
  angular.module('radioExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.specialValue = {
        "id": "12345",
        "value": "green"
      };
      $scope.color = {
        name: $scope.specialValue
      };
    }]);
</script>
<form name="myForm" ng-controller="ExampleController">
  <label>
    <input type="radio" ng-model="color.name" value="red">
    Red
  </label><br/>
  <label>
    <input type="radio" ng-model="color.name" ng-value="specialValue" checked=checked>
    Green
  </label><br/>
  <label>
    <input type="radio" ng-model="color.name" value="blue">
    Blue
  </label><br/>
  <tt>color = {{color.name | json}}</tt><br/>
 </form>
 Note that `ng-value="specialValue"` sets radio item's value to be the value of `$scope.specialValue`.
</body>
</html>

<!-- 
Copyright 2017 Google Inc. All Rights Reserved.
Use of this source code is governed by an MIT-style license that
can be found in the LICENSE file at http://angular.io/license
-->

于 2017-06-26T08:00:19.233 回答