带对象数据源的ng-options

时间:2013-12-05 06:04:56

标签: angularjs ng-options

我很难理解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>

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

错误:

  

'选择形式的预期ngOptions(作为标签)? for( key ,)? 中的(通过 expr 跟踪)?'但在类型中得到'k为(k,v)的v。

我做错了什么?

请参见plunkr:

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

1 个答案:

答案 0 :(得分:103)

这有点奇怪,但似乎你需要在for之后加一个空格。这有效:

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