元件的生命週期
在Angular中Component有定義數個生命週期鉤子
那這些鉤子是要用來作什麼的呢？
主要就是在實作中，你可能需要在不同的階段，做不同的處理
所以angular就定義了各個階段的HOOK METHOD讓我們可以依照需求，在裡面寫上相關的處理程序
例如，我想要在畫面初始化時做某件事情，我就可以在以下ngOnInit區塊中寫上相關處理程序
ngOnInit(): void {
//寫在這邊
}但我這邊就不先帶大家看全部的生命週期鉤子解說
因為如果沒有一個對應的範例，單單就只是演示的話，很難融入情境
所以相關的解說，先放到後面有遇到的時候，在一併的講解
當然，你可以先至官方文件看看有哪些鉤子，先有一個概念即可
檢視封裝
這是Component裡的css樣式，是否會溢出到別的Component的一種設定
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
encapsulation: ViewEncapsulation.Emulated,
})在上述的@Component可以宣告一個encapsulation，預設為 ViewEncapsulation.Emulated，另外有ViewEncapsulation.None及ViewEncapsulation.ShadowDom
- ViewEncapsulation.Emulated：css只會作用在自己的Component之中。
- ViewEncapsulation.ShadowDom ：css作用在自己的Dom內，僅適用於內建支援 shadow DOM 的瀏覽器。並非所有瀏覽器都支援它，這就是為什麼 ViewEncapsulation.Emulated 是推薦和預設模式的原因
- ViewEncapsulation.None：則是會將此Component的css變為全域的作用，但實務上應該不會這麼做
所以乖乖的用預設就好，那我們現在就知道有這樣的設定就好，其實不需要有所修改
想看更多的廢話，可以看影片