angular - 未触发对 ActivatedRoute.params 的订阅

标签 angular routes rxjs angular-router

问题是当我在两个相似的 URL 之间导航时,我的组件没有重绘。例如,当用户查看 http://localhost:8088/#/app/route/study/6/detail 时然后导航到 http://localhost:8088/#/app/route/study/7/detail , StudyComponent已正确重新加载。然而,DetailComponent未重装 .我认为原因是params的细节没有改变,所以 Angular 认为不重新加载是可以的。但在我的情况下,细节取决于父参数。

我怎样才能解决这个问题?

我的路线:

const studyRoutes: Routes = [
    {
        path: '', component: RouteComponent,
        children:  [
            {path: 'study/:id', component: StudyComponent,
            children: [
                {path: 'detail', component: DetailComponent },
                {path: 'parts', component: PartsComponent }
            ]
        }
    ]
}
];

我所有的组件都是这样初始化的:
ngOnInit() {
    this.loader = this.route.params.subscribe(params => this.onLoad());
}

ngOnDestroy() {
    this.loader.unsubscribe();
}

当我在不同研究的细节之间导航时,onLoad从未在 DetailComponent 中调用.

最佳答案

:id 的更改使用reactDetailComponent 处的参数级别,您需要进行以下更改:

// detail.component.ts
ngOnInit() {
    this.loader = this.route.parent.params.subscribe(params => this.onLoad());
}

这是因为路径 detail在您的 route 定义 :id参数,它的父级。因此,更改会反射(reflect)在路由器状态树中的该级别。

关于angular - 未触发对 ActivatedRoute.params 的订阅,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48650074/

相关文章:

json - Angular : 'Cannot find a differ supporting object ' [对象对象 ]' of type ' 对象'。 NgFor 仅支持绑定(bind)到 Iterables,例如 Arrays'

angular - 如何合并两个 json 对象(一个是另一个中的数组)

javascript - Express js 路由器不工作

ruby-on-rails - 如何从 Rails 中的路由命名空间获取替代信息?

Firebase 数据与 Observable 连接

angular - 如何使用 ngx-webcam 在 Angular 中录制视频 - 捕获照片有效

angular - 基于类的 Scss 变量

asp.net - Azure "~/maintenance"路由失败

angular - 在订阅回调函数中取消订阅?

javascript - 为什么我们应该使用 RxJs of() 函数?