本地服务器没有填充ng-repeat

时间:2016-07-25 11:14:16

标签: angularjs json angularjs-ng-repeat

我创建了一个如下所示的本地db.json文件:

{
  "project_topics": [
"- Any -",
"Access for disadvantaged",
"Agriculture, forestry and fisheries",
"Animal welfare",
"Energy and resources",
"Enhance social inclusion, equal opportunities and participation in sports",
"Enterprise, industry and SMEs (incl. entrepreneurship)",
"Entrepreneurial learning - entrepreneurship education",
"Environment and climate change" 
]}

我想用ng-repeat填充输入,我这样做:

<label class="item item-select " id="findYourProject-select3">
            <span class="input-label">type of project</span>
            <select ng-repeat="topic in project_topics"></select>
        </label>

未填充输入。我应该考虑什么?

2 个答案:

答案 0 :(得分:0)

您必须为options而不是select

提供ng-repeat

从外部文件http://plnkr.co/edit/tpl:8rFfZljYNl3z1A4LKSL2?p=preview

中查看plunker json

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope,$http) {
  $scope.data = {
  "project_topics": [
"- Any -",
"Access for disadvantaged",
"Agriculture, forestry and fisheries",
"Animal welfare",
"Energy and resources",
"Enhance social inclusion, equal opportunities and participation in sports",
"Enterprise, industry and SMEs (incl. entrepreneurship)",
"Entrepreneurial learning - entrepreneurship education",
"Environment and climate change" 
]};
       /* var urlPath = 'db.json';
      $http.get(urlPath).then(function(response) {
       $scope.data = response.data;
       
      }, function(error) {
       
      });*/
  
  
  
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="plunker" ng-controller="MainCtrl">
 <select  ng-model="singleSelect">
     <option  ng-repeat="topic in data.project_topics">{{topic}}</option>
    </select>
  
  </body>

答案 1 :(得分:0)

<label class="item item-select " id="findYourProject-select3">
  <span class="input-label">type of project</span>
  <select>
    <option ng-repeat="topic in project_topics" value="{{topic}}">{{topic}}</option>
  </select>
</label>

您想重复option。不是select