Question

我正在从基于控制器的＆＃39;更新基于角度1.6的Web应用程序。基于组件的应用程序＆＃39;。这是我的代码片段：

仪表板component.js

angular.module('app').component('dashboardComponent' , {
   template: '<a>Hello</a>',
   controller: function dashboardController() {
       var vm = this;
       console.log("dashboardController loaded");  
   }  
}

app-router.js：

angular.module('app').config(function($stateProvider, $urlRouterProvider){
    .state('app', {
              url: '/app',
              abstract: true,
              templateUrl: 'framework/src/layout/template.html',
              data: {
                  BreadCrumbLabel: 'Home'
              }
    })
   .state('app.dashboard', {
              url: '/dashboard',
              component: 'dashboardComponent',
             /* templateUrl: 'app/components/pages/dashboard/dashboard.html',
              controller: 'dashboardCtrl',
              controllerAs: 'dashboardCtrl',*/
    }) 
});

我正确地将它们包含在index.html中：

 <script src="app/app.router.js"></script>
 <script src="app/components/pages/dashboard/dashboard.component.js"></script>

如果我删除app.router.js文件中的评论并通过＆＃39; dashboardController＆＃39;恢复路由，它可以正常工作，但如果我将路由条目设置为＆＃39，它就不起作用;组分＆＃39 ;. 这只是一个简单的示例，似乎组件未加载，甚至console.log也无法正常工作。

这是一个plunkr链接：https://plnkr.co/edit/1aZ2aahTfT4AHIraWPCt?p=preview

这是你以前遇到过的吗？你想帮助我吗？

Angular 1.6 UI路由器无法加载组件

0 个答案: