Angular JS路由导致无限循环

时间:2013-01-28 15:52:48

标签: angularjs

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

布局

<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!

9 个答案:

答案 0 :(得分:10)

我之前也遇到过同样的问题,我认为根本原因是使用了<ng-view>,看起来在这种情况下也是如此。该路由已经加载了模板URL,因此我相信使用ng-view指令会导致该模板以递归方式加载,从而导致无限循环。

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

答案 1 :(得分:6)

症状相同的问题

我最近在我的一个项目中解决了类似的问题。我将console.log(“视频页面控制器已加载”)添加到我正在调试的控制器中。同样,它会记录该文本,直到我关闭选项卡。

我的解决方案:

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

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

我什么时候应该:

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

答案 2 :(得分:3)

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

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

答案 3 :(得分:3)

有相同的&#34;无限重装&#34;问题,亚历克斯约翰逊让我思考。实际上,如果templateURL的路径为空(这是我的情况)或错误的路径,则会发生无限的资源重新加载。 对我来说,解决方案很简单:我templateURL: ''替换为template: ''

答案 4 :(得分:2)

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

答案 5 :(得分:1)

  1. 检查部分视图路径是否正确(检查您是否获得部分视图的HTTP代码302.您可以使用morgan和Node + Express为每个请求打印HTTP代码)

    1. 如果路径正确,那么当浏览器缓存静态数据时,您仍然可能会获得无限循环。您可以在chrome中禁用缓存。为此:
      • 打开开发者控制台
      • 点击开发者控制台中的设置按钮
      • 检查选项&#34;禁用缓存(当DevTools打开时)&#34;
      • 重新启动服务器并使用处于打开状态的开发者控制台刷新页面
  2. 对我来说,在解决路径问题和禁用缓存

    之后问题已解决

答案 6 :(得分:1)

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

答案 7 :(得分:0)

与Rack应用程序有类似的问题。 解决方案是:

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

答案 8 :(得分:0)

我的问题与指定templateUrl没有初始&#34; /&#34;有关。不仅在我的路由器上,而且在我的指令上!!