angular - Angular 2 ルーティング

Question

ネットを検索して、ブラウザーの URL を変更する angular2 ルーターの例を取得しました。そこにあるすべての例は、異なるルートを変更してもブラウザの URL を変更しません。これを示すために、ES6 での小さな例を教えていただけますか?

Answer 1

Angular2 のソース コードを掘り下げた後、動的ルーティングを機能させる 1 つの方法を見つけました。この例を見てみましょう:

import {Router} from 'angular2/router';
@Component({
    ...
})
export class SampleComponent {
    public router: Router;

    constructor(router: Router) {
        this.router = router;
    }

    goTo(uri) {
        this.router.navigateByUrl(uri);
    }
}

Answer 2

一例。

コンポーネント クラス:

@RouteConfig([
  { path: '/',          name: 'home',      component: Home },
  { path: '/dashboard', name: 'dashboard', component: Dashboard },
  { path: '/todo',      name: 'todo',      component: Todo }
])
export class App {}

name必須ではありませんが、エイリアスを提供するために使用できます。

テンプレートでは:

<a router-link="home">Home</a>

タグrouter-linkに存在する必要があることに注意してください。<a>