angular - Angular 2 路由

Question

我在网上搜索了一个更改浏览器 url 的 angular2 路由器示例。当我们更改不同的路线时，所有示例都不会更改浏览器 url。你能给我一个 ES6 中的小例子来证明这一点吗？

Answer 1

一个例子。

在组件类上：

@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>标签上。

Answer 2

在深入研究 Angular2 源代码后，我找到了一种让动态路由工作的方法。让我们看看这个例子：

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 3

在您的单元测试中，您会执行类似 ..

spyOn(instance.router, 'navigateByUrl'); // first thing inside it block

expect(instance.router.navigateByUrl).toHaveBeenCalledWith(uri); // near end of it block when you would have expected the navigation to have happened