Question

我一直在练习AngularJS和Angular Material。我已经按照教程使用了ng-repeat。我试图自己这样做，但我似乎无法让它工作。我没有任何控制台错误。我没有看到可能遗漏的东西所以我可能错过了Angular中的一个重要概念。谢谢你的帮助！

Plunker：http://plnkr.co/edit/31WaRmH5RRdW5TFEFbg2

HTML

<html lang="en" ng-app="myApp">
<head>
<meta charset="utf-8"> 
<title>Angular Material</title>
<link rel="stylesheet" href="https://cdn.rawgit.com/angular/bower-material/v0.8.3/angular-material.css" />
<script src="https://code.angularjs.org/1.3.15/angular.js" data-semver="1.3.15"></script>
<script src="https://code.angularjs.org/1.3.15/angular-animate.js"></script>
<script src="https://code.angularjs.org/1.3.15/angular-aria.js"></script>
<script src="https://code.angularjs.org/1.3.15/angular-route.js"></script>
<script src="https://cdn.rawgit.com/angular/bower-material/v0.8.3/angular-material.js"></script>
<!-- ICON SET -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-material-icons/0.7.1/angular-material-icons.min.js"></script>

<script src="app.js"></script>
<script src="controllers.js"></script>

</head>

<body>

  <md-list flex>

      <md-item ng-repeat="artist in artists">
      <a>
        <md-item-content md-ink-ripple layout="row" layout-align="start center">
          <div class="inset">{{ artist.name }}
          </div>
        </md-item-content>
      </a>
    </md-item> 
</md-list>

</body>
</html>

app.js

var myApp = angular.module('myApp', [
                                 'ngMaterial',
                                 'ngRoute',
                                 'ngMdIcons',
                                 'artistControllers'
                                ]);

controllers.js

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

artistControllers.controller('ListController', ['$scope', '$http', function($scope, $http){
    $http.get('data.json').success(function(data){
        $scope.artists = data;
    });
}]);

Answer 1

您错过了ng-controller以包含在元素中。

<md-list flex ng-controller="ListController">

Plunker

Answer 2

您缺少ng-controller

<body ng-controller="ListController"> 
</body>

无法让ng-repeat工作

2 个答案: