Angular2刷新路由器插座答案

【问题标题】：Angular2 refresh router-outletAngular2刷新路由器插座
【发布时间】：2017-06-07 07:51:53
【问题描述】：

我正在开发 CRM，我在标题中有一个选择框，允许用户更改当前用户，另外，主要内容在router-outlet里面。

当用户选择另一个用户时，我想刷新页面但只刷新路由器插座，因此信息将用于新用户

我看到其他 CRM 只是将用户重定向到仪表板/索引页面，但我想让用户保持在同一页面上。

【问题讨论】：

您为什么要这样做？如果您更新模型，绑定将被更新。应该不需要刷新路由器插座。
当用户从选择框中选择一个选项时，正在调用 api 并仅更新存储在会话存储中的用户信息，例如当您单击“设置”页面时，路由器插座中显示的组件正在调用 API 并从会话存储中发送用户 ID，因此我需要调用 API 以再次获取此数据，但对于正确的用户，这就是我想要的原因刷新页面，以便使用正确的用户 ID 再次调用
我会创建一个 LoginStatusService 或类似的可观察对象，它会在登录状态更改时发出一个值，并且组件应该订阅该可观察对象并在收到值时进行 API 调用。跨度>

标签： javascript angular angular2-routing angular2-template angular-routing

【解决方案1】：

你应该在服务中有一个函数

import {Subject} from 'rxjs/Subject';

onUserChange= new Subject<void>();

userChange(): void {
    this.http.post('')
        .map()
        .subscribe((data: UserChangeResponse) => {
             this.onUserChange.next();
        })
}

并且在组件中你可以在 ngOnInit 中使用它

serviceReference.onUserChange.subscribe(() => {

     // use can call get users method or anything

});

【讨论】：

我会使用带有初始值的BehaviorSubject。