角函数被多次调用

Question

I have a component method that I'm invoking for the template.

For example:

export class Component {
  isValid(id): Observable<boolean> {
    return service.isValid(id)
  }
}

<div *ngIf="isValid(1) | async"></div>
<div *ngIf="isValid(2) | async"></div>
<div *ngIf="isValid(3) | async"></div>

The isVaild method returns an observable. The problem is that in each change detection cycle Angular calls the isValid method which returns a new observable.

What is the solution to this kind of situations?

Answer 1

If subscribe to the service then you'll use that logic in callback function like so

export class Component {
  isValid: boolean;

  isValid(id) {
    service.isValid(id).subscribe(response => {
      this.isValid = response;
    });
  }
}

Then in template you dont need to call isValid function and no need to use | async | async

<div *ngIf="isValid(1)"></div>
<div *ngIf="isValid(2)"></div>
<div *ngIf="isValid(3)"></div>