带有对象数据源的 ng-options答案

【问题标题】：ng-options with object data source带有对象数据源的 ng-options
【发布时间】：2016-07-24 18:27:35
【问题描述】：

我很难理解 ng-options 如何与数据源一起工作。我已经阅读了文档，我觉得我正在做需要做的事情，但我在尝试时仍然遇到问题。

<!DOCTYPE html>
<html ng-app="app">
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.min.js">              </script>
    <link rel="stylesheet" href="style.css" />
    <script type="text/javascript">
      angular.module('app', [])
      .controller('IndexCtrl', ['$scope', function($scope) {
        $scope.types = {
          1: "value1",
          2: "value2",
          5: "value3"
        };
      }]);
    </script>
  </head>
  <body ng-controller="IndexCtrl">
    <select ng-model="type" ng-options="k as v for(k, v) in types">
      <option value="">Select Type</option>
    </select>
  </body>
</html>

我总是在控制台中收到此错误：

错误：

'select 形式的预期 ngOptions（作为 label）？ for (key,)?value in collection (track by expr)?'但是得到了'k as v for(k, v) in types'。

我做错了什么？

在此处查看 plunkr：

http://plnkr.co/edit/Bl6u4151KyDkxhYrsdCm?p=preview

【问题讨论】：

标签： angularjs ng-options

【解决方案1】：

这有点奇怪，但您似乎需要在for 后面加一个空格。这有效：

<select ng-model="type" ng-options="k as v for (k, v) in types">
  <option value="">Select Type</option>
</select>

【讨论】：

没错！事实上，现在我仔细观察，角度文档也有空间。 docs.angularjs.org/api/ng.directive:select
这是由于用于解析 ng-option 子句的正则表达式。
这里有示例如何使用 select 子句 jsfiddle.net/6unbrp1e
@KrisJaklik，在您的情况下，源是一个数组，而不是 OP 要求的对象。
嗨，谁能告诉我为什么我们需要在 ng-options="k as v for (k, v) in types" 中创建“（k，v）”，因为我们可以做的是工作也可以通过编写 ng-options="k as v for v in types" 来完成。