从其父级导航 <router-outlet>
Navigating a <router-outlet> from its parent
我正在尝试从其父项更改 a 中的活动组件。看看如何 Ionic does it,我认为它应该类似于这个(非常简化):
@Component({
template: '<router-outlet></router-outlet>'
})
export class MyComponent {
@ViewChild(RouterOutlet) router: RouterOutlet;
foo() {
this.router.navigate('/route');
}
}
显然这行不通。有什么办法可以做类似的事情吗?
提前致谢!
而不是@ViewChild(RouterOutlet) router: RouterOutlet;
,您应该将它注入到组件的构造函数中。而不是使用 RouterOutlet
,而是使用 Router
。您的组件将如下所示:
@Component({
template: '<router-outlet></router-outlet>'
})
export class MyComponent {
constructor(router: Router) {}
foo() {
this.router.navigateByUrl('/route');
}
}
此外,您需要确保您已经在应用程序模块中包含 RouterModule
和您的网址列表。
我正在尝试从其父项更改 a 中的活动组件。看看如何 Ionic does it,我认为它应该类似于这个(非常简化):
@Component({
template: '<router-outlet></router-outlet>'
})
export class MyComponent {
@ViewChild(RouterOutlet) router: RouterOutlet;
foo() {
this.router.navigate('/route');
}
}
显然这行不通。有什么办法可以做类似的事情吗?
提前致谢!
而不是@ViewChild(RouterOutlet) router: RouterOutlet;
,您应该将它注入到组件的构造函数中。而不是使用 RouterOutlet
,而是使用 Router
。您的组件将如下所示:
@Component({
template: '<router-outlet></router-outlet>'
})
export class MyComponent {
constructor(router: Router) {}
foo() {
this.router.navigateByUrl('/route');
}
}
此外,您需要确保您已经在应用程序模块中包含 RouterModule
和您的网址列表。