在嵌套的javascript对象上使用ng-repeat来显示select-options

时间:2014-01-09 18:19:04

标签: javascript html angularjs angularjs-ng-repeat 2-way-object-databinding

如何使用angular的ng-repeat指令显示两个带有正确选项的下拉菜单?

这是JSBin

JS:

 angular.module('myApp', [])
    .controller('MainCtrl', function($scope) {

      $scope.templates = {
        pages: ['home', 'about'],
        posts: ['blog', 'lab']

      };

    });

HTML:

 <div class="container" ng-controller="MainCtrl">
    <form action="" class="col-lg-12" >
       <select class="form-control" ng-repeat="template in templates.pages>
        <option value = "{{ template }}"> {{ template }}</option>
      </select>
      <select class="form-control" ng-repeat="template in templates.posts>
        <option value = "{{ template }}"> {{ template }}</option>
      </select> 
    </form>

  </div>

1 个答案:

答案 0 :(得分:0)

应在选项标签中使用

ng-repeat。另外,在ng-repeat表达式中关闭双引号。

此处您已修复JSBin