前言
用表單處理使用者輸入的資料是許多常見應用的基礎功能,像是使用者登入、修改資料、建立資料等等。
而 Angular 提供了兩種不同的方式透過表單處理使用者的輸入:
- 響應式表單 ( reactive )
- 範本驅動表單 ( template-driven )
這些名詞看起來相當陌生,實際上用起來最簡單的會是範本驅動表單,因為它的使用方式相當直觀。
響應式表單 ( reactive )
然而,根據官方文件的敘述,響應式表單的優點是:
- 可擴充套件性
- 可複用性
- 可測試性
以上這三點特性都比範本驅動表單要強,如果這個表單是專案內相當重要且複雜的部份,推薦使用這種方式來建立表單。
範本驅動表單 ( template-driven )
範本驅動表單的優點就是易於使用,很容易就能在目前的 Angular 應用中添加一個簡易的表單,像是使用者的登入。
白話來說,如果需求的表單功能相當簡易、邏輯不複雜,可以考慮使用範本驅動表單。
兩者差異
以下為官方標註的差異
小結
具體來說該用哪種呢?
實際上這沒有絕對的好壞,還是得看使用情境。
倘若使用的情境既不需要寫測試、需要用到表單的地方邏輯又相當簡單,那就可以使用範本驅動表單搞定;相反的,若是相當複雜那就可以考慮使用響應式表單了。
接下來試著以範本驅動表單的方式來建立一個表單吧~