未调用路由中的AngularJS控制器

AngularJS Controller in route is not called

本文关键字:AngularJS 控制器 调用 路由      更新时间:2023-10-28

下面是我的Angular应用程序的剪报:

routes.js

angular.module("App")
    .config(['$routeProvider', function($routeProvider) {
        $routeProvider.when('/users/:id', {
                templateUrl : 'pages/show.html',
                controller : 'UsersController',
                controllerAs : 'usCtrl'
            })
} ]);

my-users-controller.js

(function() {
    angular.module("App")
        .controller("UsersController", ['$http', '$routeParams', 
            function($http, $routeParams) {
              alert('Hello !');
              this.user= $routeParams.id;
              console.log($routeParams.id);
        } ]);
})();

show.html(插入到ng视图中)

<div class="row">
  <div class="col-xs-12 col-md-4">
     Hello {{ usCtrl.user }}
  </div>
</div>

由于某些原因,我的控制器没有被调用。当我点击我的链接

<a ng-href="#/users/john" ...

路由工作正常,但不调用控制器,并且不显示usCtrl.user如果我对控制器使用内联函数,一切都很好我所说的内联是指

...
controller : function($routeParams) {
  // code 
}
...

有什么建议吗?

看起来控制器从未初始化和注册。

验证您的生成链是否正确地拉入了文件。

然后验证是否正在调用控制器注册。

(function() {
    console.log('Controller Registered');
    angular.module("App")
        .controller("UsersController", ['$http', '$routeParams', 
            function($http, $routeParams) {
              alert('Hello !');
              this.user= $routeParams.id;
              console.log($routeParams.id);
        } ]);
})();
angular.module("App",[])
    .config(['$routeProvider', function($routeProvider) {
       ....
} ]);

您的控制器立即与模块App一起执行,然后被相同的模块App 覆盖