AngularJS：-ngRoute 和控制器 http GET 请求导致无限循环

Question

我正在学习 AngularJS 网站上的教程，但遇到了问题。我尝试使用 console.log() 和警报自己调试问题。似乎有关 http 请求的某些内容导致它在无限循环中调用 ngRoute 指令。

我读过一些其他帖子说这是因为服务器返回 index.html 作为对 http 请求的响应。我认为这是我的问题，但我不确定如何检查我的 GET 请求返回的内容。

如何测试返回的内容并防止这种无限循环？

main.js 内容

var coffeeBeanApp = angular.module('coffeeBeanApp', [
    'ngRoute',
    'coffeeBeanControllers'
    ]);

coffeeBeanApp.config(['$routeProvider', function($routeProvider)
    {
        $routeProvider.
    when('/coffee', {
        templateUrl: 'partials/coffee-list.html',
        controller: 'CoffeeListCtrl'
    }).
    when('/coffee/:slug', {
        templateUrl: 'partials/coffee-detail.html',
        controller: 'CoffeeDetailCtrl'
    }).
    otherwise({
        redirectTo: '/coffee'
    });
}]);

controllers.js

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

coffeeBeanControllers.controller('CoffeeListCtrl', function ($scope, $http) {
        $http.get('/api/coffee').success(function(data){$scope.beans = data;})
});

coffeeBeanControllers.controller('CoffeeDetailCtrl',
    ['$scope', '$routeParams', function($scope, $routeParams){
        $scope.slug = $routeParams.slug;
    }]);

Answer 1

试试这个以获得更好的调试：

$http.get('/api/coffee').then((function successCallback(response) {
       // this callback will be called asynchronously
       // when the response is available
       console.log(response); 
}, function errorCallback(response) {
       // called asynchronously if an error occurs
       // or server returns response with an error status.
       console.log(response);
});

或者你可以在你的成功回调中加入一个console.log（在https://docs.angularjs.org/api/ng/service/$http中用红色标记为弃用）

 $http.get('/api/coffee').success(function(data){console.log(data);});