From e92907f9c4d0d4bb83b0bce7033ff21d3ca46cf5 Mon Sep 17 00:00:00 2001
From: Hien Pham <phhien203@gmail.com>
Date: Sat, 14 Mar 2026 14:04:14 +0200
Subject: [PATCH] feat(Answer: 51): remove effect when action changes

---
 .../src/app/action.component.ts                        | 10 ++++------
 1 file changed, 4 insertions(+), 6 deletions(-)

diff --git a/apps/signal/51-function-call-effect/src/app/action.component.ts b/apps/signal/51-function-call-effect/src/app/action.component.ts
index 22e0e7a4f..359c7a746 100644
--- a/apps/signal/51-function-call-effect/src/app/action.component.ts
+++ b/apps/signal/51-function-call-effect/src/app/action.component.ts
@@ -1,7 +1,6 @@
 import {
   ChangeDetectionStrategy,
   Component,
-  effect,
   inject,
   signal,
 } from '@angular/core';
@@ -18,7 +17,8 @@ import { UserService } from './user.service';
       </label>
       <select
         name="actions"
-        [(ngModel)]="action"
+        [ngModel]="action"
+        (ngModelChange)="logMessage($event)"
         id="actions"
         class="block w-full rounded-lg border border-gray-300 bg-gray-50 p-2.5 text-sm text-gray-900 focus:border-blue-500 focus:ring-blue-500">
         <option selected>Please select an action</option>
@@ -36,9 +36,7 @@ export class ActionsComponent {
 
   protected actions = ['Create', 'Read', 'Update', 'Delete'];
 
-  constructor() {
-    effect(() => {
-      this.userService.log(this.action() ?? 'No action selected');
-    });
+  logMessage(action: string | undefined) {
+    this.userService.log(action ?? 'No action selected');
   }
 }