组件中的 DoCheck 确实检测到服务中的更改

Posted 2023-02-23

【中文标题】组件中的 DoCheck 确实检测到服务中的更改

【英文标题】：DoCheck in component do detect changes in a service

【发布时间】：2017-03-25 03:50:43

【问题描述】：

我最近遇到了“如何检测服务中的更改，并使其在我的组件中可见”的问题。

我使用 DoCheck() 解决了它：

DoCheck()
    if( this.componentVar != this.myService.serviceVar)
         this.componentVar = this.myService.serviceVar;
    

而且效果很好！但是我在任何地方都没有看到这是一个好方法，所以这是我的问题： 你觉得这个解决方案好不好？

【问题讨论】：

客户端可能更容易订阅服务上的 observable 并从那里推动更改或比较。 DoCheck 被称为很多。请参阅angular.io/docs/ts/latest/guide/lifecycle-hooks.html#!#docheck 了解以这种方式挂钩的缺点

【参考方案1】：

$doCheck 被认为是替代 $scope watch 的一种“监视”方式。我可以看到您的代码将您的组件绑定到服务变量。这是紧密耦合，不推荐。它还在每个导致性能问题的摘要周期中运行。更好的方法是在组件变量上使用一种方式绑定。所以你的组件变成了更可重用的转储组件。

var childComponent = 
  bindings:  componentVar: '<' ,
  controller: function () 
    this.$onChanges = function (changes) 
           if(changes.componentVar)
                   //do something here
            
    ;
  
;

angular
  .module('app')
  .component('childComponent', childComponent);

【讨论】：

通过包含适当的 Angular 版本和其他任何需要的东西，确保您的 sn-p 确实运行。否则将其转换为普通代码块。