如何在角度2中将一条路线导航到另一条路线

Question

我制作了角度2的两个不同组件.我正在学习这个链接的路由 https://angular.io/docs/ts/latest/tutorial/toh-pt5.html

我制作了两个组件.在第一个组件中,我有一个按钮,我想移动到第二个组件

这是我的代码 https://plnkr.co/edit/GBOI9avZaPGaxaLQbtak

我定义这样的路线

    const routes =[
      {
        path: 'ft',
        component: First
      },
      {
        path: 'sd',
        component: Second
      }
    ]

@NgModule({
  imports: [ BrowserModule ],
  declarations: [ App ],
  bootstrap: [ App,First ,Second]
}) 

我在用 <router-outlet>

但我无法将一个组件移动到另一个组件

Answer 1

您也可以在不调用组件功能的情况下导航按钮本身

<button routerLink="/sd">move to secon comp</button>

Answer 2

你去:

@Component({
  selector: 'first',
  template: `
    <div>
      <button (click)="moveToSecond()">move to secon comp</button>
    </div>
  `,
})
export class First {
  name:string;
  constructor(private router:Router) {
  }

  moveToSecond(){
    this.router.navigate(['/sd']);
  }
}

https://plnkr.co/edit/wIuaffLskQd8GJuqLlY6?p=preview

你有很多错误:D

无论如何,为了导航到另一条路线,您需要使用路由器