angularjs - Angular JS路由导致无限循环

Question

我试图弄清楚为什么页面在点击时没有导航到它的模板。URL 更新，我没有 JS 错误。我相信它会加载文件，但随后它会无限加载控制器。我console.log('test!')在 SessionsController 的实例化中放入了一个之后发现了这一点。

布局

<div ng-view></div>

我的观点

<a href="/testing"> My link of seriousness </a>

我的JS

window.MainController = function($scope, $route, $routeParams, $location) {
  $scope.$route = $route;
  $scope.$location = $location;
  $scope.$routeParams = $routeParams;
  console.log($route);
  console.log($location);
  console.log($routeParams);
};

MainController.$inject = ["$scope", "$route"];

window.app = angular.module('web_client', [], function($routeProvider, $locationProvider) {
  return $routeProvider.when('/testing', {
    templateUrl: '/partials/other_stuff/index.html',
    controller: 'MyController'
  });
});


window.MyController = function($scope, $http) {
  console.log('Infinite Loop!');
};

而在partials/sessions/new.html，我又大又亮：

FOOBAR!

score 10 · Accepted Answer

我以前也遇到过同样的问题，我认为根本原因是<ng-view>在这种情况下也使用了它。该路由已经加载了一个模板 URL，所以我相信使用 ng-view 指令会导致该模板被递归加载，从而导致无限循环。

尝试删除 ng-view，而是将所有视图标记直接放在您在路由的 templateUrl 中指定的 .html 模板中。或者，如果它是共享模板，请尝试使用 ng-include 代替（例如<div ng-include src="'/path/to/template.html'"></div> ，不要忘记路径周围的单引号将其标识为字符串，而不是范围变量引用！）。

score 6 · Accepted Answer

相同症状的问题

我最近在我的一个项目中解决了类似的问题。我将 console.log("Video Page Controller Loaded") 添加到我正在调试的控制器中。同样，它会记录该文本，直到我关闭选项卡。

我的解决方案：

我为模板文件引用了错误的名称。

when('/videos', {
  templateUrl: 'templates/video-list.tpl.html',
  controller: 'VideoListCtrl'
})

当我应该有的时候：

when('/videos', {
  templateUrl: 'templates/video-list.html',
  controller: 'VideoListCtrl'
})

score 3 · Accepted Answer

我唯一看到的是缺少括号和缺少逗号。你可以试试这个：

$routeProvider
  .when("/login", {
    templateUrl: "sessions/new.html",
    controller: SessionsController
  })
  .otherwise({
    redirectTo: "/"
  });

score 3 · Accepted Answer

有同样的“无限重装”问题，亚历克斯约翰逊让我思考。事实上，如果 templateURL 的路径是空的（这是我的情况）或错误的路径，就会发生无限的资源重新加载。对我来说，解决方案很简单：我用templateURL: ''.template: ''

score 2 · Accepted Answer

我遇到了同样的问题，最终意识到我实际上并没有创建我告诉它加载到我的 app.config 中的部分 html 文件——如果它找不到模板文件，Angular 似乎进入了无限循环控制器功能。

score 1 · Accepted Answer

检查部分视图路径是否正确（检查您是否获得部分视图的 HTTP 代码 302。您可以使用 morgan 和 Node+Express 打印每个请求的 HTTP 代码）
1. 如果路径正确，那么当浏览器缓存静态数据时，您仍然可能会出现无限循环。您可以禁用 chrome 中的缓存。为此：
  - 打开开发者控制台
  - 点击开发者控制台中的设置按钮
  - 检查选项“禁用缓存（当 DevTools 打开时）”
  - 重启服务器并刷新页面，开发者控制台处于打开状态

对我来说，解决路径问题并禁用缓存后问题解决了

score 1 · Accepted Answer

我的问题是模板 URL 不正确，然后开始触发与 URL 模式匹配的路由。仔细检查您的templateUrl路径是否正确。

score 0 · Accepted Answer

使用 Rack 应用程序遇到了类似的问题。解决方案是：

use Rack::Static, urls: ["/js", "/css", "/templates"]

score 0 · Accepted Answer

我的问题与指定没有初始“/”的templateUrl有关，不仅在我的路由器上，而且在我的指令上！

angularjs - Angular JS路由导致无限循环

9 回答 9

Related

Reference