Angular ngOnChanges正在多次呼叫

我使用ngFor生成了多个离子载玻片，并在其中插入了一个组件。它多次调用ngOnChanges。我希望它只调用一次，这样我就可以调用我的api了

我试过使用多个角度的钩子

这就是我创建幻灯片的方式，菜单有19个元素

<ion-slides #slides [options]="slideOpts" (ionSlideDidChange)="slideChanged($event)">
<ion-slide *ngFor="let i of menu; let j = index">
  <h1>{{ i.name }}</h1>
  <app-homenews [categoryId]="currentCategoryId" ></app-homenews>
</ion-slide>
</ion-slides>

我只想叫它一次，它现在叫了19次

---

我可以在这里使用rxjs吗？

ngOnChanges

在模板绑定中输入变量的值发生更改时运行。因此多次触发它是一种正常行为。如果希望只执行一次代码，则可以像这样使用它

@Input() isFirstRun;
ngOnChanges(changes: SimpleChanges) {
  if(this.isFirstRun){
     let chg = changes['categoryId'];
     console.log(chg.currentValue);
  }
}

<ion-slide *ngFor="let i of menu; let j = index">
  <h1>{{ i.name }}</h1>
  <app-homenews [isFirstRun]="j===0?true:false" [categoryId]="currentCategoryId" ></app-homenews>
</ion-slide>

@Input（）是第一次运行；
ngOnChanges（更改：SimpleChanges）{
if（this.isFirstRun）{
设chg=changes['categoryId']；
控制台日志（chg.currentValue）；
}
}
{{i.name}

您可以在服务中添加isFirstRun标志，并在组件中使用该标志 您可以继续使用ngOnchanges，因为它在值更改时会很有帮助

ngOnChanges(changes: SimpleChanges) {
if (this.flagService.isFirstRun || value has changed) {
// call API
}
} 

---

我用过一次这种方法来避免使用ngOnChanges循环

在您的组件中：

private _changes;
private id;
@Input()
  set changes(changes) {     

      this._changes= changes;
      this.id = changes[id];

    }
  }
  get changes(): string {
    return this._changes;
  }

---

我怀疑上面的任何一个都会起作用，因为组件模板在for循环内部，所以它每次都会调用ngOnInit（与调用ngOnChanges相同-即使CurrentCategoryId在循环内部没有修改），变量方法也会因同样的原因不起作用，该变量每次都将获得默认值，因此您可以将

isFirstRun

作为输入变量，并从父级提供它。在模板第一次迭代中，您可以将值作为true发送。

private _changes;
private id;
@Input()
  set changes(changes) {     

      this._changes= changes;
      this.id = changes[id];

    }
  }
  get changes(): string {
    return this._changes;
  }