如何让Component Router $ router与Webpack& ocLazyLoading?

时间:2016-09-12 14:44:04

标签: angularjs webpack components router oclazyload

我想让我的Angular / Webpack / ocLazyLoad应用程序正常工作。我的应用代码如下所示:

var app = angular.module('app', ['oc.lazyLoad', 'ngComponentRouter']);
app.config(function ($locationProvider) {
$locationProvider.html5Mode(true);
});

app.value('$routerRootComponent', 'app');

app.component('app', {
template: [
'<a ng-link="[\'Home\']">Home</a> |',
'<a ng-link="[\'Heroes\']">Heroes</a> |',
'<a ng-link="[\'CrisisCenter\']">Crisis Center</a>',
'<hr>',
'<ng-outlet></ng-outlet>',

].join('\n'),

controller: ['$router', '$ocLazyLoad', function($router, $ocLazyLoad) {

$router.config([
    {path: '/', name: 'Home', component: 'home', usaAsDefault: true},

    //Heroes Route
    {
        path: '/heroes/...',
        name: 'Heroes',
        loader: function () {
            // lazy load Heroes
            /*return $ocLazyLoad.load([require('heroes.module')])
                .then(function () {
                    return 'heroes';
                });*/
        }
    },

    //Crisis Center Route
    {
        path: '/crisis-center/...',
        name: 'CrisisCenter',
        loader: function () {
            // lazy load CrisisCenter
            /*return $ocLazyLoad.load([require('')])
                .then(function () {
                    return 'crisisCenter';
                });*/
        }

    }

    ]);
 }]

 });

但是我得到$ router的未知提供者错误。代码调试完美并达到我的代码的特定点,但我不能让它与Webpack一起工作(它在我实现它之前工作)

提前致谢!

1 个答案:

答案 0 :(得分:0)

$router更改为$rootRouter解决了这个问题。