[Solved] Given this Angular code snippet, what will happen after 1 second?constructor(private zone: NgZone) { setTimeout(() => { this.zone.run(() => { this.message = 'Updated!'; }); }, 1000); } | Angular

Angular - Change Detection

Given this Angular code snippet, what will happen after 1 second?

constructor(private zone: NgZone) {
  setTimeout(() => {
    this.zone.run(() => {
      this.message = 'Updated!';
    });
  }, 1000);
}

AThe UI does not update because setTimeout is outside Angular zone.

BThe UI updates to show 'Updated!' automatically after 1 second.

CAn error occurs because run() cannot be used inside setTimeout.

DThe message changes but UI needs manual refresh.

Step-by-Step Solution

Solution:

Step 1: Analyze setTimeout with NgZone.run
The setTimeout callback runs inside zone.run(), so Angular detects changes.
Step 2: Understand UI update behavior
Angular automatically updates the UI to show the new message after 1 second.
Final Answer:
The UI updates to show 'Updated!' automatically after 1 second. -> Option B
Quick Check:
NgZone.run triggers UI update = A [OK]

Quick Trick: NgZone.run inside async triggers UI update automatically [OK]

Common Mistakes:

MISTAKES

Master "Change Detection" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

Given this Angular code snippet, what will happen after 1 second?