【问题标题】:Angular Lifecycle hook when there is a change on service服务发生变化时的Angular Lifecycle钩子
【发布时间】:2022-01-15 20:08:44
【问题描述】:

我有一项服务 - 让我们调用 ServiceA,

它会进行多次 HTTP 调用,我想在计算完所有内容后检索信息。为此,我有一个布尔变量 - isEverythingProcessed,当这种情况发生时。

在我的组件上 - 让我们调用 ComponentB,

我在做:

ngOnCheck(){
    
    if(this.serviceA.isEverythingProcessed){
    
    //dostuff
    
    }
}

这可行,但它被调用了数百次。有任何替代方法,我的意思是在组件上实现一个生命周期,检测服务的变量何时被更改?

【问题讨论】:

    标签: angular angular-lifecycle-hooks


    【解决方案1】:

    您可以使用 rxjs 创建一个即将更新的 onInit 值的 observable,并订阅更改。这就是我看到它完成的方式。虽然,如果某些东西有效并且没有严重的性能影响(使用单个 if 语句进行优化的 fn 调用,即使它被调用了几百次也不是那么糟糕,尽管并不理想)我不会过度设计它。

    【讨论】:

    • 我强烈推荐你学习 BehaviourSubject。
    【解决方案2】:

    Subject 在这里可能就足够了,因为您的组件正在监听更改。例如,当有侦听器时,BehaviorSubject 总是会发出,但您可能只想在它发出时收听,确切地说是在它发出时。因此,在服务中创建一个主题而不是布尔变量,在组件中订阅它,并在主题发出时发挥你的作用。组件销毁时记得取消订阅!

    所以我建议如下

    服务:

    isEverythingProcessed = new Subject<boolean>();
    

    当你所有的计算完成后,拨打next()就可以了:

    this.isEverythingProcessed.next(true)
    

    和组件:

    this.service.isEverythingProcessed.subscribe((bool: boolean) => {
      // do stuff!
    })
    

    STACKBLITZ DEMO

    如果您需要一个初始值并始终触发,我建议使用BehaviorSubject 而不是Subject。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2023-04-02
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-11-22
      • 2014-04-20
      相关资源
      最近更新 更多