Angular ：是否可以让 Angular 指令（例如 NgIf 和 NgFor）仅在我想要的时候检查它们绑定到的变量？

Question

My Problem

From what I understand, Angular directives work by following the LifeCycleHook rhythm of the framework.
In other words, they are checked at certain times in the cycle, so that the related values are checked several times per second. However, I would have liked to know if it was possible to control these checks.

---

A situation

For example, let's imagine that I have an NgFor linked to an Array of 1000 objects.
What will happen is that each object will be checked several times per second. That's a few thousand checks per second.
But that doesn't work for me. It's a lot more processing than I'd like.

What I'm interested in is that my NgFor is checked only at the initialization of my page and during certain actions of the user.

---

My Question and What i've tried

So my question is:

Is it possible to make the Angular directives, especially the NgIf and the NgFor, no longer perform checks following the rhythm of the LifeCycleHook and instead perform checks only when I want them to ? Or do I have to do this using pure HTML/CSS/Javascript methods ?

To solve this problem, I've already looked into TrackBy. However, this does not change the heart of the problem.
It will still be a few thousand checks that will be performed. Except that they will be checks of values and not of objects.

Answer 1

Have you tried using ChangeDetectionStrategy.OnPush?

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.html',
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class MyComponent implements OnInit {
  constructor(private changeDetector: ChangeDetectorRef) {
  }

  prop1: string;
  prop2: string;

  someMethod(): void {
    prop1 = 'abc';
    // *ngIf won't be checked yet
    prop2 = 'xyz';
    // nor here
    this.changeDetector.detectChanges();
    // now it will

  }
}