角度模块注入错误(角度 1.5)

>我已经定义了一个示例项目结构来尝试ngComponentRouter。以下是以下文件，

我可能错过了可能基本的几件事。

索引.html

<h1 class="title">Component Router</h1>
<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.6/angular.min.js"></script>
  <!-- Load up the router library - normally you might use npm/yarn and host it locally -->
  <script src="https://unpkg.com/@angular/router@0.2.0/angular1/angular_1_router.js"></script>
  <script src="./app.js"></script>
  <script src="./crisis.js"></script>
</head>
<body ng-app="app">
  <mycomp><mycomp>
</body>

应用.js

angular.module('app', ['ngComponentRouter','crisis-center'])
.value('$routerRootComponent', 'mycomp')
.component('mycomp', {
  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'},
    {path: '/heroes', name: 'Heroes', component: 'heroes' }
  ]
});

而且，危机.js

看起来像：

angular.module('crisis-center', [])
  .component('crisisCenter', {
    template: '<h2>Crisis Center</h2>'
      +'<div><button ng-click="vm.navigate()"</div>',
    controllerAs: "vm",
    controller: [ "$rootRouter",function($rootRouter){
      var vm = this;
      vm.navigate = fucntion() {
        console.log("In Navigate");
        $rootRouter.navigate(["SampleCrisis"]);
      };
      // return vm; -- Not sure about it
    }]
  });

控制台中的错误包括：

crisis.js:8 Uncaught SyntaxError: Unexpected token {

angular.js:38 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.5.6/$injector/modulerr?p0=app&p1=Error%3A%20%…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.5.6%2Fangular.min.js%3A21%3A332)
    at angular.js:38
    at angular.js:4630
    at q (angular.js:322)
    at g (angular.js:4591)
    at db (angular.js:4513)
    at c (angular.js:1777)
    at Ac (angular.js:1798)
    at fe (angular.js:1683)
    at angular.js:31018
    at HTMLDocument.b (angular.js:3197)

其实有一个错别字，在危机中.js line.no 8 它应该是函数而不是功能

更改如下，

angular.module('crisis-center', [])
    .component('crisisCenter', {
        template: '<h2>Crisis Center</h2>' +
            '<div><button ng-click="vm.navigate()"</div>',
        controllerAs: "vm",
        controller: ["$rootRouter", function ($rootRouter) {
            var vm = this;
            vm.navigate = function () {
                console.log("In Navigate");
                $rootRouter.navigate(["SampleCrisis"]);
            };
            return vm;
        }]
    });

相关内容

最新更新

热门标签：