Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 角度:如何使用ngRepeat并设置默认单选按钮选项?_Javascript_Angularjs_Forms - Fatal编程技术网

Javascript 角度:如何使用ngRepeat并设置默认单选按钮选项?

Javascript 角度:如何使用ngRepeat并设置默认单选按钮选项?,javascript,angularjs,forms,Javascript,Angularjs,Forms,我检查过了,但没有太大帮助,因为他们使用ng repeat的方式不同 这也无济于事 我有一张表格: <label ng-repeat="option in options"> <input type="radio" ng-model="myObject.value" ng-value="option.key"> </label> 我想设置一个默认的单选选项。不管我怎么做,列表中的最后一个选项都被设置为默认值。我肯定我不明白这是为什么,所以我来了 如何设置

我检查过了,但没有太大帮助,因为他们使用ng repeat的方式不同

这也无济于事

我有一张表格:

<label ng-repeat="option in options">
  <input type="radio" ng-model="myObject.value" ng-value="option.key">
</label>
我想设置一个默认的单选选项。不管我怎么做,列表中的最后一个
选项都被设置为默认值。我肯定我不明白这是为什么,所以我来了


如何设置默认的单选选项?当前配置有什么问题?感谢您的帮助。

如果要将
myObject.value
的值设置为输入的默认选项,则必须有一个带有该键的选项

演示:


只要将
$scope.myObject.value
选项
数组

的键的匹配值设置好就可以了,但另一个答案在我之前提交了。您需要设置
myObject.value
以匹配
选项。key
您希望成为默认值

Script.js

(function () {
angular.module('radioExample', [])
  .controller('ExampleController', ['$scope',
    function($scope) {

      $scope.options = [{
        'key': 'Option 1',
        'val': 'Value 1'
      }, {
        'key': 'Option 2',
        'val': 'Value 2'
      }, {
        'key': 'Option 3',
        'val': 'Value 3'
      }];

      $scope.myObject = {
        value: 'Option 2'
      };
    }
  ]);
})();
Index.html

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

<head>
  <script data-require="angular.js@*" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="ExampleController">
  <form name="Options">
    <div ng-repeat="option in options">
      <label>{{option.key}}</label>
      <input type="radio" ng-model="myObject.value" ng-value="option.key">

    </div>
    Selected option is {{myObject.value}}
  </form>

</body>

</html>

{{option.key}
所选选项为{myObject.value}

可能重复@MarkoGrešak谢谢,但我也不知道该示例中发生了什么,而且该解决方案不起作用。该示例似乎表明您所说的不完全正确:该示例显示了来自3个不同位置的选项。也许你能更好地解释你在说什么?@Proto在链接示例中,输入与
$scope.color.name
绑定,该变量的值为蓝色。因此,默认选择的输入是具有蓝色值的输入。在您的示例中,您的输入具有与
$scope.myObject.value
的绑定。因此,默认选择的输入将与
$scope.myObject.value
值匹配。此外,您的输入将填充一个
选项.key
数组,这就是语句“如果要将
myObject.value
的值设置为输入的默认选项,则必须有一个带有该键的选项”的原因您还应该将数据格式化为数组而不是对象,以便AngularJS在其中进行迭代。
<!DOCTYPE html>
<html ng-app="radioExample">

<head>
  <script data-require="angular.js@*" data-semver="1.4.0-beta.6" src="https://code.angularjs.org/1.4.0-beta.6/angular.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body ng-controller="ExampleController">
  <form name="Options">
    <div ng-repeat="option in options">
      <label>{{option.key}}</label>
      <input type="radio" ng-model="myObject.value" ng-value="option.key">

    </div>
    Selected option is {{myObject.value}}
  </form>

</body>

</html>