AngularJS: - ngRoute 和 Controller http GET 请求导致无限循环

AngularJS: - ngRoute and Controller http GET request causing infinite loop

我正在学习 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;
    }]);

试试这个更好的调试:

$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);});