Javascript 在Angular 6中,如果路径相同,我无法再次加载该组件
如果路由相同,但父组件中的数据已更改,则我无法再次加载组件。 我有一个route.ts,所有路由都写在它上面假设一个组件的/module/{name}我只更改父组件中的数据,但路由是相同的,如何处理这种情况 在父组件中,我在api调用父组件成功后导航到路由Javascript 在Angular 6中,如果路径相同,我无法再次加载该组件,javascript,angular,typescript,angular6,Javascript,Angular,Typescript,Angular6,如果路由相同,但父组件中的数据已更改,则我无法再次加载组件。 我有一个route.ts,所有路由都写在它上面假设一个组件的/module/{name}我只更改父组件中的数据,但路由是相同的,如何处理这种情况 在父组件中,我在api调用父组件成功后导航到路由 this.Service.updateInfo(res['Info']); this.router.navigate([routeUrl] ,{relativeTo: this.route }); 在子级渲染中使用路由器出口,并使用
this.Service.updateInfo(res['Info']);
this.router.navigate([routeUrl] ,{relativeTo: this.route });
在子级渲染中使用路由器出口,并使用
this.selected = this.Service.InfoData;
服务文件
public updateInfo(data) {
if(data) {
this.InfoData = data;
}
}
但是,一旦路由相同,子级将无法从服务获取更新的数据。请尝试对路由配置进行以下设置
onSameUrlNavigation:“重新加载”
注意这可能对性能影响不大。您可以使用BehaviorSubject使用angular services将数据从一个组件发送到新组件。在你的情况下,你需要这样
InfoData = new BehaviourSubject<any>([]);
// inside your service
两个组件都必须注入一个服务。并且数据属性必须在服务内部。然后从父组件更改服务的数据属性,子组件通过rxjs subject订阅服务的数据获取新数据。这样你就不需要重新加载路由器了component@GaurangDhorda你能帮我举个例子让我看清楚吗。首先分享你的代码。这样会更有帮助。@GaurangDhorda我已经更新了我的问题,你能帮我吗?或者你还需要其他数据,而不是“请评论”将添加它创建行为主题,像这样
InfoData=new behaviorsubject([])代码>在您的服务中我已经尝试过了,但这对我不起作用,并且给出“OnSameurNavigation:“reload”将影响我的整个应用程序。您尝试将其放入父组件的IDshouldReuseRoute
,因为您必须将其放入路由中定义的父组件。添加此“shouldReuseRoute”后,否@Pankaj Prakash在父组件中,这不允许我更改URL始终将我重定向到默认选择的路由。嘿,好了。这是一个次优的解决方案。问题是注入组件的数据没有挂钩,因此数据更改不会更新组件。重新加载页面以解决问题,这实际上只是隐藏了问题,将来会再次失败。
export class YourComponent {
constructor(private router: Router) {
this.router.routeReuseStrategy.shouldReuseRoute = () => false;
}
}
InfoData = new BehaviourSubject<any>([]);
// inside your service
this.InfoData.next(data) //and it will gives data.