From df83d27fb65c5c72db04c4945ad9cc2e9bbcf326 Mon Sep 17 00:00:00 2001
From: HarveyChou <harveychou@origtek-com.tw>
Date: Tue, 8 Nov 2022 10:12:10 +0800
Subject: [PATCH] =?UTF-8?q?=E9=9F=BF=E6=87=89=E5=BC=8F=E8=A1=A8=E5=96=AE?=
 =?UTF-8?q?=20=E5=88=A9=E7=94=A8FormControl=E5=BB=BA=E7=AB=8B=E5=96=AE?=
 =?UTF-8?q?=E4=B8=80=E6=AC=84=E4=BD=8D=E8=A1=A8=E5=96=AE=EF=BC=8C=E4=B8=A6?=
 =?UTF-8?q?=E7=94=A8console=E7=B4=80=E9=8C=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/app/app.component.html |  3 ++-
 src/app/app.component.ts   | 18 ++++++------------
 src/app/app.module.ts      |  4 ++--
 src/app/task.service.ts    | 28 ----------------------------
 src/app/task.ts            |  4 ----
 5 files changed, 10 insertions(+), 47 deletions(-)
 delete mode 100644 src/app/task.service.ts
 delete mode 100644 src/app/task.ts

diff --git a/src/app/app.component.html b/src/app/app.component.html
index ec4a8ff..7de4498 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1 +1,2 @@
-<pre>{{ tasks | json }}</pre>
+查詢條件:<input type="text" [formControl]="condition" />
+<button type="button" (click)="onSearch()">查詢</button>
diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 80b2002..47a1d79 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,22 +1,16 @@
-import { HttpResponse } from '@angular/common/http';
-import { Component, OnInit } from '@angular/core';
+import { Component } from '@angular/core';
+import { FormControl } from '@angular/forms';
 
-import { Task } from './task';
-import { TaskService } from './task.service';
 
 @Component({
   selector: 'my-app',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css'],
 })
-export class AppComponent implements OnInit {
-  tasks: Task[] = [];
+export class AppComponent  {
+  readonly condition = new FormControl();
 
-  constructor(private taskService: TaskService) {}
-
-  ngOnInit(): void {
-    this.taskService.getList().subscribe((res: HttpResponse<any>) => {
-      this.tasks = res.body;
-    });
+  onSearch(): void{
+    console.log(`查詢條件:${this.condition.value}`);
   }
 }
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index df3b810..927c20c 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -1,11 +1,11 @@
 import { NgModule } from '@angular/core';
-import { FormsModule } from '@angular/forms';
+import {  ReactiveFormsModule } from '@angular/forms';
 import { BrowserModule } from '@angular/platform-browser';
 
 import { AppComponent } from './app.component';
 
 @NgModule({
-  imports:      [ BrowserModule, FormsModule ],
+  imports:      [ BrowserModule, ReactiveFormsModule ],
   declarations: [ AppComponent ],
   bootstrap:    [ AppComponent ]
 })
diff --git a/src/app/task.service.ts b/src/app/task.service.ts
deleted file mode 100644
index fcb711c..0000000
--- a/src/app/task.service.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import { HttpResponse } from '@angular/common/http';
-import { HttpEvent } from '@angular/common/http';
-import { HttpEventType } from '@angular/common/http';
-import { HttpClient } from '@angular/common/http';
-import { Injectable } from '@angular/core';
-import { Observable, tap } from 'rxjs';
-
-import { Task } from './task';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class TaskService {
-  constructor(private httpClient: HttpClient) {}
-
-  getList(): Observable<HttpEvent<Task[]>> {
-    return this.httpClient
-      .get<Task[]>('assets/tasks.json', {
-        observe: 'events',
-        reportProgress: true,
-      })
-      .pipe(
-        tap((event) =>
-          console.log(`Http Event Type = ${HttpEventType[event.type]}`)
-        )
-      );
-  }
-}
diff --git a/src/app/task.ts b/src/app/task.ts
deleted file mode 100644
index b407bb4..0000000
--- a/src/app/task.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export class Task {
-  subject!: string;
-  content!: string;
-}