[Solved] Given this component with OnPush strategy:@Component({ selector: 'app-sample', changeDetection:... }What happens if the parent updates counter by changing its value from 1 to 2? | Angular

Angular - Performance Optimization

Given this component with OnPush strategy:

@Component({
  selector: 'app-sample',
  changeDetection: ChangeDetectionStrategy.OnPush,
  template: `{{ counter }}`
})
export class SampleComponent {
  @Input() counter = 0;
}

What happens if the parent updates counter by changing its value from 1 to 2?

AThe component updates and shows 2

BThe component does not update because OnPush disables updates

CThe component updates only if the reference changes

DThe component updates only if manually triggered

Step-by-Step Solution

Solution:

Step 1: Understand input change detection with OnPush
OnPush triggers update when an @Input() value changes, including primitive value changes like number from 1 to 2.
Step 2: Apply to given scenario
Since counter changes from 1 to 2, the component updates and shows the new value.
Final Answer:
The component updates and shows 2 -> Option A
Quick Check:
OnPush updates on input value change = true [OK]

Quick Trick: Primitive input changes trigger OnPush updates [OK]

Common Mistakes:

Thinking OnPush disables all updates
Confusing reference change with primitive value change
Assuming manual trigger is always needed

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

Given this component with OnPush strategy:

Step 1: Understand input change detection with OnPush

Step 2: Apply to given scenario

Final Answer:

Quick Check:

Want More Practice?