Question

你好，我是棱角分明的新人，我又来帮忙了。我试图从json文件中获取数据：teams.json但它不起作用我的控制器是这样的：

app.controller('TeamController', ['$http', function($http){
    var liste = this;
    liste.teams = [];    
    $http.get('teams.json').success(function(data){
        liste.teams = data;
    });
}]);

并在我的HTML中：

<!DOCTYPE html>
<html ng-app="teamStats">

    <head>
        <link rel="stylesheet" href="style.css">
        <script src="script.js"></script>
        <script src="angular.js"></script>
        <script src="app.js"></script>
    </head>
    <body ng-controller="TeamController">
        <!--
        %%%%%%%%%%%%%%%%%%%%%%%%%%% BODY CONTENT        
        -->
        <div id="wrap" >
                <div class="container"> 
                    <div >
                        <ul>
                          <li ng-repeat="team in liste.teams">{{team.name + team.win}}</li>
                        </ul>
                    </div>
                </div> 
        </div>          
        <!--
        %%%%%%%%%%%%%%%%%%%%%%%%%%% END OF BODY CONTENT     
        -->
    </body>
</html>

非常感谢提前！希望有人看到我错在哪里我做了一个更容易理解的傻瓜 myPlunker

祝你好运，文森特

Answer 1

将您的控制器更改为此

  app.controller('TeamController', ['$http', '$scope',
    function($http, $scope) {
      var liste = this;
      $scope.liste = {};
      $scope.liste.teams = [];
      $http.get('teams.json').success(function(data) {
        $scope.liste.teams = data;
      });
    }
  ]);

修复你的json文件。您需要删除其他,

演示：http://plnkr.co/edit/jeHnvykYLwVZLsRLznRI?p=preview

Answer 2

好的，我想我现在知道为什么它不起作用!! ng-repeat，ng-view，ng-include和其他人使用AJAX加载模板。问题是默认情况下浏览器不允许AJAX请求位于本地文件系统上的文件（出于安全原因）。因此，您有两种选择：

运行将为您的文件提供服务的本地Web服务器告诉您的浏览器允许本地文件访问

感谢所有人的帮助!!感谢Vadim的解释!!非常感谢zsong！：）

AngularJS从JSON读取数据

2 个答案: