Angular 2 - 如何使用新的角度2.0.0-rc.1路由器

问题描述

我已经开始编写一个新的角度2项目，我发现我安装了2个角度路由器：

I've started to write a new angular 2 project and I found that I installed 2 angular router:

1. @ angular / router：2.0.0-rc.1，


2. @ angular / router-deprecated ：2.0.0-rc.1，

1. "@angular/router": "2.0.0-rc.1",
2. "@angular/router-deprecated": "2.0.0-rc.1",

我没有找到角度网站如何使用新的路由器。例如，我需要导入哪个组件。

I didn't find in the angular site how to use the new router. For example, what component do I need to import.

所以我的问题是：

1. 我应该使用路由器弃用的吗？


2. 有没有关于如何使用新路由器的好文档？

1. Should I use the router-deprecated?
2. Is there any good doc for how to use the new router?

推荐答案

以下是如何使用Angular 2路由器（RC1），与beta（已弃用）相比：

• 路线替换 RouteConfig 。



• 在配置中有一个新语法：

• Routes replaces RouteConfig.

• Inside your config there is a new syntax:

{path：'/ path'，component：MyPathComponent}

而不是：

{path：'/ path'，name： 'MyPath'，组件：MyPathComponent}

现在使用routerLink就是这样：

Using routerLink is now like that:

< a [routerLink] =['/ path / 2']>点击导航< / a>

而不是：

< a [routerLink ] =['MyPath'，'详情'，{id：2}]>鲨鱼危机< / a>

• 此外没有 RouteParams 了，相反，你得到了路由器生命周期钩子使用
  的参数： CanActivate ， OnActivate 和
  CanDeactivate 。

• Also there is no RouteParams anymore, instead you get the params usingthe router lifecycle hooks: CanActivate, OnActivate, andCanDeactivate.

如果你在 ngOnInit ，你现在可以这样做：

If you used params inside ngOnInit, you can do that like this now:

routerOnActivate(curr: RouteSegment): void {
           curr.getParam('id');
       }

你最终会得到这样的结果：

You will end up having something like this:

import {ROUTER_DIRECTIVES, Router, Routes} from "@angular/router";

@Injectable()
@Component({
    selector: "my-app",
    templateUrl: `<a [routerLink]="['/component1']">Click to go to component 1</a>`,
    directives: [ROUTER_DIRECTIVES]
})
@Routes([
    {path: "/component1", component: Component1},
    {path: "/component2", component: Component2}
])
export class AppComponent {
    constructor(private _router: Router) {
        //If you want to use Router in your component (for navigation etc), you can inject it like this
    }
}

更新（9/6/16）：
似乎Angular 2 RC1路由器与旧版本一样被弃用。
新建议使用版本3.0.0-alpha.3 @ angular / router。

Update (9/6/16):It seems that Angular 2 RC1 Router is being deprecated like the old one.The new recommendation is to use version 3.0.0-alpha.3 of @angular/router.

以下是Angular博客的更多信息：


Here is more info at the Angular blog:http://angularjs.blogspot.co.il/2016/06/improvements-coming-for-routing-in.html

以下是新路由器的概述：


Here is an overview of the new router:http://victorsavkin.com/post/145672529346/angular-router

这是一个有效的插件：


And here is a working plunker:http://plnkr.co/edit/ER0tf8fpGHZiuVWB7Q07?p=preview

这篇关于Angular 2 - 如何使用新的角度2.0.0-rc.1路由器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！