前一篇，我們完成了需求一：

1. 當使用者在關鍵字搜尋這個 input 輸入文字時，要在輸入框的正下方顯示正在輸入的字元數。

今天我們要接著完成需求二：

2. 當使用者在輸入框按下 esc 鍵時，會清空輸入框的內容。

首先，我們一樣在 input 標籤上新增一個 keyup 事件，並綁定到一個清空文字的方法：

(keyup)="clearText($event)"

在 AppComponent 裡 clearText 方法中的 $event 型別一樣是 KeyboardEvent。

接下來我們要抓取 esc 按鍵，因為我們要透過判斷式，來判斷使用者是否按下 esc 按鍵，才會觸發 clearText 方法。因此我們要先在方法裡印出 $event 的資訊。

切換到網頁，我們先在 input 框裡，按下 esc 鍵，此時在開發人員工具中，會印出這個事件的資訊，我們需要找到一個叫做 keyCode 的 property。

我們可以從上圖中看到，key property 是 Escape，也就是 esc 鍵，而 keyCode 則是 27，因此我們可以在 clearText 方法中使用判斷式，如下圖：

接著我們同樣要取得 input 的 value 及 value 的長度。

接著在判斷式裡，把 input 的 value 及 length 清空。

切換到網頁，先在 input 裡輸入文字。

接著按 esc 鍵，我們可以看到 input 清空了，字元數也歸零了。

以上，我們達成了需求二，But！

眼尖的朋友應該有注意到，剛才在使用 keyCode 時，程式碼有點怪異，查看了訊息，竟然寫著：

這是什麼意思，我其實不清楚，所以我要試著找另一種解決方法，下一篇我們會來探討另一種寫法。

本篇寫法，如果有前輩、朋友能協助解釋，並且在現有寫法基礎下，提供修正的解法，還請不吝指教，謝謝！若我之後有找到想關的資訊、解法，也會更新在本文章中。