$routeProvider 没有触发控制器答案

【问题标题】：$routeProvider not firing Controller$routeProvider 没有触发控制器
【发布时间】：2014-05-23 00:54:05
【问题描述】：

我遇到的情况是 Angular $routeProvider 似乎没有在路由更改时触发控制器操作。

路由是超级简单的url：

window.app = angular.module('app', ['ngRoute', 'app.filters', 'app.services', 'app.directives', 'app.controllers'])
    .config([
        '$routeProvider', function($routeProvider) {
            console.log("app.js config launched");

            $routeProvider
                .when('/nav', {
                    templateUrl: 'temp/test.html',
                    controller: 'navController'
                    // controller: function($scope) { alert('scope called.') }                    
                })
                .when('/home', {
                    controller: 'homeController',
                    template: ' '
                });

            $routeProvider.otherwise({ redirectTo: '/home' });
        }
    ]);

控制器只是为了验证访问权限而注销：

app.controller('navController', [
    "$scope", "cellService",
    function ($scope, cellService) {
        console.log("**** navController fired");
    }
]);

初始化代码触发，因此路由被初始化。当我击中时：

http://localhost:4333/app/#/nav

并且 url 发生变化，我可以看到 test.html 模板被浏览器访问，但控制器永远不会触发。

这似乎表明路由正在被 URL 更改激活，但由于某种原因控制器没有触发。我尝试过使用函数而不是控制器名称，但这也永远不会被解雇。我还通过将 ng-controller="navController" 附加到元素来验证控制器是否有效，并且可以很好地触发控制器。

这是一个最初没有关联路由的页面，因为它基本上是一个独立的页面，不需要导航。事后我添加了路线代码。我添加了一个 ng-view（之前没有），之后至少模板开始加载 - 没有 ng-view 什么都不会发生。

难住了，不知道还能看什么。帮助。

【问题讨论】：

所以当你进入 /nav 时，你看到的是 html 而不是控制器？有没有可能遇到订购问题？您可以尝试在控制器的创建中设置一个断点发生得太晚了吗？
没有实际发生的事情是 HTML 会加载到浏览器中（devtools 视图），但控制器不会触发。 html 也没有呈现。想通了 - 请参阅下面的答案。

标签： angularjs angularjs-routing

【解决方案1】：

事实证明问题确实是我的操作错误，但我认为这是一个可能导致问题的场景，所以我会用这个作为答案。

导致此问题的原因有两个：

HTML 模板 HTML 页面（通过 templateUrl）的 URL 无效，因此该页面从未加载并且控制器没有因此而被解雇。
切换到模板时，我使用了一个空模板 (" ")，但也删除了 ng-View 指令。 ng-View 指令必须存在即使使用空模板。没有它，控制器不会触发。

在这两种情况下它都不起作用，我错误地认为控制器没有被触发，这令人困惑，因为如果我明确地将它与 ng-controller 挂钩，它确实会触发。

是的，简单的操作员错误，但后者至关重要 - 没有 ng-View 控制器不会触发。

【讨论】：

【解决方案2】：

如果你在外部定义函数并引用它会发生什么？所以不是

.when('/nav', {
                templateUrl: 'temp/test.html',
                controller: 'navController'
                       })

应该是

.when('/nav', {
                templateUrl: 'temp/test.html',
                controller: navController
                              })

其他地方

 function navController($scope, cellService){
    console.log("**** navController fired");
 }
 navController.$inject = ['$scope', 'cellService'];

【讨论】：