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!

Answer 1

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

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

Answer 2

症状相同的问题

我最近在我的一个项目中解决了类似的问题.我将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'
})

Answer 3

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

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