时间戳

首页 > 解决方案 > Angular 11 在服务的不相关组件之间共享数据

angular - Angular 11 在服务的不相关组件之间共享数据

问题描述

我正在使用 Angular 11，并且在 componentB 中有很多方法（以一种方式称呼它）

我现在必须从组件A 调用许多存在于组件B 中的方法。

我知道我可以将所有方法转移到服务中，但在这种情况下，工作量很大，我只需要一个快速的解决方法。

所以我想保持 componentB 的状态，并且能够从 componentA 调用它的方法。

componentA 和 componentB 不相关。

有没有一种解决方法可以做到这一点而不必将方法移出componentB？

标签： angularangular11

解决方案

您可以通过服务来完成，这将被注入到两个组件中 服务可能是这样的

@Injectable()
class MyDataService implements IMyDataService  {
 
    private whenMessageRecieved$: Subject<MyDataType> =
        new ReplaySubject(1);
 
    constructor(
    ) {
    }
 
    public notify(someData: MyDataType): void {
        this.whenMessageRecieved$.next(someData);
    }
 
    public whenMessageRecieved(): Observable<MyDataType> {
        return this.whenMessageRecieved$.asObservable();
    }
}

ComponentB 应该订阅 whenMessageRecieved() 并且 componentA 应该使用严格的参数调用 notify。在不久的将来，此服务将帮助您从 componentB 迁移方法

但是仍然-最好将通用逻辑存储在其他地方，而不是在componentB中

推荐阅读