第1章 Angular初識 1 Angular的版本問題，Angular的組件是什麼？

Angular是什麼？

Angular是一個前端框架

• 集成了不少經常使用功能。
• 每個頁面接口組件化，可維護性、可複用性提升
• 使用TS代替JS，經過編譯階段的類型檢查，下降了錯誤發生的機率。
• 自帶開發服務器，隨着編寫業務，實時重載，實時報錯，方便調試。
• 幫助build(打包)，造成完整的項目。

以上看的有點頭疼。下面開始簡單的介紹。

---

版本問題

Angular框架是Google發佈的開源項目，在Angular2以前的版本，咱們稱之爲AngularJS，這個版本和Angular2之後的版本有本質上的區別。本系列只介紹Angular2之後的版本，而對Angular2以後到Angular8的一系列不一樣版本，能夠認爲是版本2.1到2.8的區別。

---

基本組成

首先想象一個沒有框架的世界，假設我須要開發任意一個頁面UI，那麼：

• 我須要一個html文件
• 在html中，經過style標籤嵌入CSS樣式。
• 在html中，經過script嵌入JS邏輯

以前講過，Angular提供了組件化的搭建方式，上面三條 構建任意頁面UI的要素就被集合到一個組件當中。換句話說

一個Angular組件包括一個js文件，一個CSS文件，一個html文件，這三個文件被放到一個文件夾中，文件夾的名稱就是組件名稱，其中每一個文件的名稱也和組件名稱相同，而且以不一樣後綴區分。

• 前面已經說過，Angular用TS代替JS，因此js文件改成ts文件
• 細心的你必定發現，還有一個後綴spec.ts文件，這是用於考察組件有沒有bug的「期中考試文件」。由於還沒到考試周，暫時放一放。
  假設個人組件名字叫作 login-panel，那麼這個組組件的文件結構應該是這樣的：
• login-panel
  • login-panel.component.css
  • login-panel.component.ts
  • login-panel.component.html