小编Inc*_*ion的帖子

我有几个表单数组，需要进行验证，以便每个表单行中的特定字段在所有表单数组中必须是唯一的。如果任何值出现多次，则两个表单字段都必须标记为红色。

我设法编写了一个函数，以便如果这些字段有任何更改，该函数将返回 true/false。但我不确定如何将其用于实际验证过程。

组件.html：

<div formArrayName="temperatureFormArr">
  <div class="row" *ngFor="let temperature of parentForm['controls'].detailForm['controls'].temperatureFormArr['controls']; let i=index"
    [formGroupName]="i">
    <div class="col-4">
      <mat-form-field appearance="outline" class="fex-input">
          <mat-label>Higher Level Function</mat-label>
        <input autocomplete = "off" matInput placeholder="Higher Level Function" (input)="testFunction(i, 'temperatureFormArr')" formControlName="higherLevelFunction">
      </mat-form-field>
    </div>
    <div class="col-6">
      <mat-form-field appearance="outline" class="fex-input">
          <mat-label>Description</mat-label>
        <input autocomplete = "off" matInput placeholder="Description" formControlName="description">
      </mat-form-field>
    </div>
  </div>
</div>

<div formArrayName="waterPressureFormArr">
  <div class="row" *ngFor="let waterPressure of parentForm['controls'].detailForm['controls'].waterPressureFormArr['controls']; let i=index"
    [formGroupName]="i">
    <div class="col-4">
      <mat-form-field appearance="outline" class="fex-input">
          <mat-label>Higher Level Function</mat-label>
        <input autocomplete = "off" matInput placeholder="Higher Level Function" …

我在页面中使用材质表，并且希望表数据源每 5 秒刷新一次，以便值的任何更改都将反映在表中。这就是我现在所做的：

everyFiveSeconds: Observable<number> = timer(0, 5000);

ngOnInit() {
this.everyFiveSeconds.subscribe(() => {
  this.getComponents();
});

getComponents()发送获取请求并将输出分页到材料表。然而问题是，一旦我最初加载此页面，每 5 秒就会发出一次 get 请求。但即使我导航到另一个页面，应用程序也会继续发送请求。如果我重新访问该页面，请求每 2.5 秒发送一次，并且如果我重复，请求的频率会不断增加。

如何修改我的代码，以便仅当我位于此组件页面时才发送此 get 请求，并确保如果我重新访问此页面，不会创建多个计时器？