[Solved] Identify the error in this component using OnPush strategy:@Component({ selector: 'app-test', changeDetection:... } }Why might the template not update after calling updateTitle()? | Angular

Angular - Performance Optimization

Identify the error in this component using OnPush strategy:

@Component({
  selector: 'app-test',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `{{ title }}`
})
export class TestComponent {
  title = 'Hello';

  updateTitle() {
    this.title = 'World';
  }
}

Why might the template not update after calling updateTitle()?

ABecause the title variable is not decorated with @Input()

BBecause OnPush requires manual change detection calls always

CBecause the method updateTitle() is not called in the template

DBecause OnPush ignores internal property changes without input or event

Step-by-Step Solution

Solution:

Step 1: Understand OnPush and internal state changes
OnPush does not detect changes from internal property updates unless triggered by input change or event.
Step 2: Apply to updateTitle method
Changing title internally won't update template unless change detection is triggered.
Final Answer:
Because OnPush ignores internal property changes without input or event -> Option D
Quick Check:
OnPush ignores internal changes without triggers [OK]

Quick Trick: Internal changes need input/event to update OnPush component [OK]

Common Mistakes:

Thinking @Input() is required for all properties
Assuming method call in class updates template automatically
Believing OnPush always requires manual detectChanges

Master "Performance Optimization" in Angular

9 interactive learning modes - each teaches the same concept differently

Learn Why Deep Visual Try Challenge Project Recall Perf

More Angular Quizzes

Identify the error in this component using OnPush strategy:

Step 1: Understand OnPush and internal state changes

Step 2: Apply to updateTitle method

Final Answer:

Quick Check:

Want More Practice?