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