angular 1.5使用$ routeConfig vs $ router.config进行路由

时间:2016-01-15 22:56:58

标签: angularjs

我正在使用新的角度路由器。我看到的大多数帖子都在2.0左右,应该非常相似。

但是,我一直在处理源代码https://github.com/brandonroberts/angularjs-component-router/tree/master/lib

我注意到有$ routerRootComponent的使用。我一直试图弄清楚这是否可以用作组件的默认起始位置。但是,我收到了错误

Error: Component "Root" has no route config.

我最初认为我正在控制器中正确设置routeConfig,因为这样......

(function() {
    'use strict;'
    angular
        .module('componentTutorial.home')
        .value('$routerRootComponent', 'componentTutorial.home')
        .component('home',HomeComponentOptions);

        var HomeComponentOptions = {

            bindings: {  
                title: '@'
            },
            templateUrl: 'app/home/home.html',
            controller: HomeController      
        }

        function HomeController ($router) {
            $routeConfig: [
                {path: '/home...', name: 'Home', useAsDefault: true}
            ];
        }
})();

我的愿望是让路线靠近他们的家庭控制器。最初我已经设置了一个指令,并在一个指令的控制器中托管了所有路由,但是设置子路由并且很难找到它会让人感到困惑。

-Ex

unction AppController($router) {
        console.log('configuring routers');

        $router.config([
            {
                path: '/',
                component: 'home',
                name: 'Home'
            },
            {
                path: '/**',
                component: 'notFound',
                name: 'NotFound'
            },
            {
                path: '/about',
                component: 'about',
                name: 'About'
            }

        ]);
    }

任何有关使用路线设置组件的见解都将非常受欢迎。

1 个答案:

答案 0 :(得分:0)

(function() {
    'use strict;'
    angular
        .module('componentTutorial.home', ['ngComponentRouter'])
        .value('$routerRootComponent', 'app')
        .component('home',HomeComponentOptions);

        var HomeComponentOptions = {

            bindings: {  
                title: '@'
            },
            templateUrl: 'app/home/home.html',
            controller: HomeController      
        }

        function HomeController ($router) {
            $routeConfig: [
                {path: '/home...', component: 'home', name: 'Home', useAsDefault: true}
            ];
        }
})();

为模块依赖项添加了'ngComponentRouter'。将第二个值的参数更改为将添加到应用程序(componentTutorial.home)中的自定义元素。请参阅下面的HTML示例。 第三,向HomeController $ routeConfig添加一个新的属性组件。组件值应该是组件名称。

HTML

 <app></app>