Bird
0
0

Which of the following is the correct way to create an effect using Angular's createEffect function?

easy📝 Syntax Q12 of 15
Angular - State Management
Which of the following is the correct way to create an effect using Angular's createEffect function?
Aconst loadData$ = createEffect(() => { this.actions$.pipe(ofType(load), switchMap(() => fetchData())); });
Bconst loadData$ = createEffect(() => this.actions$.pipe(ofType(load), switchMap(() => fetchData())));
Cconst loadData$ = createEffect(this.actions$.pipe(ofType(load), switchMap(() => fetchData())));
Dconst loadData$ = createEffect(() => this.actions$.pipe(ofType(load), map(() => fetchData())));
Step-by-Step Solution
Solution:

  1. Step 1: Check the syntax of createEffect

    The createEffect function expects a function returning an observable, so it should be () => this.actions$.pipe(...).

  2. Step 2: Verify operators used

    Using switchMap is correct for side effects that return new observables. const loadData$ = createEffect(() => this.actions$.pipe(ofType(load), switchMap(() => fetchData()))); uses this correctly.

  3. Final Answer:

    const loadData$ = createEffect(() => this.actions$.pipe(ofType(load), switchMap(() => fetchData()))); -> Option B

  4. Quick Check:

    createEffect needs a function returning observable [OK]
Quick Trick: createEffect needs a function returning an observable [OK]
Common Mistakes:
  • Passing observable directly instead of a function
  • Using map instead of switchMap for async calls
  • Not returning the observable inside createEffect

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions
More Angular Quizzes
Angular Signals - Why signals are introduced - Quiz 3easy Angular Signals - Input signals and model signals - Quiz 15hard Angular Signals - Signal vs observable comparison - Quiz 12easy Animations - Trigger and state definitions - Quiz 13medium Animations - Animate method for timing - Quiz 2easy Performance Optimization - Bundle size analysis - Quiz 8hard Server-Side Rendering - Angular Universal overview - Quiz 9hard Server-Side Rendering - SSR vs CSR mental model - Quiz 12easy Testing - Testing routing and navigation - Quiz 2easy Testing - Testing forms and user interactions - Quiz 8hard