如何在ngOnInit（）之前停止调用ngOnChanges

Question

在我的角度应用程序中，我提出了一种情况，只有在输入绑定到更改时才应调用ngOnchanges。那么，有没有办法在ngOnInit之前停止执行ngOnChanges。有没有办法实现这一目标。 在此先感谢。

Answer 1

您无法阻止此行为，但您可以：

使用主题：

class Foo implements OnChanges,OnInit{

  onChanges = new Subject<SimpleChanges>();

  ngOnInit(){
    this.onChanges.subscribe((data:SimpleChanges)=>{
      // only when inited
    });
  }

  ngOnChanges(changes:SimpleChanges){
    this.onChanges.next(changes);
  }

}

使用布尔属性：

class Foo implements OnChanges,OnInit{

  initialized=false;

  ngOnInit(){
    // do stuff
    this.initialized = true;
  }

  ngOnChanges(changes:SimpleChanges){
    if(this.initialized){
      // do stuff when ngOnInit has been called
    }
  }

}

使用SimpleChanges API

您还可以查看SimpleChange.isFirstChange()方法：

  

isFirstChange() : boolean   检查新值是否是指定的第一个值。

class Foo implements OnChanges,OnInit{

  @Input()
  bar:any;

  ngOnInit(){
    // do stuff
  }

  ngOnChanges(changes:SimpleChanges){
    if(!changes["bar"].isFirstChange()){
      // do stuff if this is not the initialization of "bar"
    }
  }

}

Answer 2

以防万一，这是我如何在我的AngularJS应用中实施@ n00dl3建议的isFirstChange()解决方案的示例：

this.$onChanges = (changes) => {
    if (!changes.value.isFirstChange()) {
        // do stuff
    }
};

Answer 3

我想这不是OP所要的，但是以下内容提供了一种无需修改组件代码即可摆脱 ngOnChanges（）调用的方法。

与其在模板中使用适当的选择器声明组件，不如使用ng-template：

<ng-template></ng-template>

然后使用ViewContainerRef#createComponent方法在此ng-template内生成组件。

这样，您的组件将被实例化而无需任何输入，并且 ngOnInit（）之前将不再调用 ngOnChanges（）。