无法实例化控制器Angular新路由器

Question

我正在使用1.4版本的新Angular路由器，当为组件做一个简单的控制器时，它会抛出一个错误:

angular.module('app.campaigns',['security', 'ngNewRouter'])
  .controller('CampaignsController', ['authService', '$rootScope', CampaignsController]);   

function CampaignsController (authService, $rootScope) {
    console.log ('this is campaigns controller');
    this.currentUser = $rootScope.authService.currentUser;
    this.authService = $rootScope.authService;
    this.logout = authService.logout;
}

我试过没有注入$rootScope，是一样的。我做错了什么?一个非常相似的组件的作用就像魅力，但这不是。

Answer 1

这是在angular 1.5中使用的新路由器的最新示例，在1.4中你将无法使用component()，我认为除非你自己添加它，尽管它只是一个包装指令。

你应该使用从angular2项目构建的angular_1_router.js，而不是安装angular-new-router包(直到它被更新)在下面的例子中，他们使用了angular 1.5，并对其进行了修正，这样你就可以使用components()和子路由等了。

查看完整示例链接:http://plnkr.co/edit/N3YP3dKMuljpZ6mWsVBT?p=preview

app.js

angular.module('app', ['ngComponentRouter', 'dialog', 'heroes', 'crisis-center'])
.config(function($locationProvider) {
  $locationProvider.html5Mode(true);
})
.run(function($router) {
  $router.config([
    { path: '/...', name: 'App', component: 'app', useAsDefault: true }
  ]);
  $router.navigate(['App']);
})
.component('app', {
  template:
    '<nav>n' +
    '  <a ng-link="['CrisisCenter']">Crisis Center</a>n' +
    '  <a ng-link="['Heroes']">Heroes</a>n' +
    '</nav>n' +
    '<ng-outlet></ng-outlet>n',
  $routeConfig: [
    {path: '/crisis-center/...', name: 'CrisisCenter', component: 'crisisCenter', useAsDefault: true},
    {path: '/heroes/...', name: 'Heroes', component: 'heroes'},
    {path: '/disaster', name: 'Asteroid', redirectTo: ['CrisisCenter', 'CrisisDetail', {id:3}]}
  ]
});