angular - 导航一个从它的父母那里

Question

我正在尝试从其父级更改 a 中的活动组件。看看Ionic 是如何做到的，我认为它应该与此类似（非常简化）：

@Component({
    template: '<router-outlet></router-outlet>'
})
export class MyComponent {
    @ViewChild(RouterOutlet) router: RouterOutlet;

    foo() {
        this.router.navigate('/route');
    }
}

显然这是行不通的。有没有办法做类似的事情？

先感谢您！

Answer 1

而不是@ViewChild(RouterOutlet) router: RouterOutlet;，您应该将其注入组件的构造函数中。而不是使用RouterOutlet，你使用Router。您的组件将如下所示：

@Component({
    template: '<router-outlet></router-outlet>'
})

export class MyComponent {
    constructor(router: Router) {}

    foo() {
        this.router.navigateByUrl('/route');
    }
}

此外，您需要确保RouterModule您的应用模块中已包含您的 URL 列表。