Angular ng-content select使用方法

Angular中，會透過ng-content來協助將內容放置到child component中，最近才知道原來ng-content內還有一個selector的方式，可以讓使用更彈性。

Angular 4：加入Bootstrap css

這邊單純做一個筆記，一般直接從bootstrap網站下載好，再加入連結到專案內也可以，

只是Angular 4提供了另外的方法可以使用，這邊做一個紀錄，之後方便查詢使用。

Angular 4: Service

Service可以在不同的component與service中傳遞與共用一些資訊，有了這樣的功能，有些在component上原本透過event binding來實作的功能，改用service來輔助，開發上也會變得簡單與方便許多，且可以達到相同的目的。

Angular 4: Structural Directive

我們在Angular內可以自己定義Directive，而可以對DOM作新增、移除或是修改Element的Directive又稱作Structural Directive。

像是ngIf或是ngFor這一類的directive就是structural directive，ngIf可以在特定條件下讓element加入或移除DOM；nfFor則是根據資料來源將element加入或移除DOM中。

Angular 4：自訂Directive

我們定義了一個component，如果我們希望透過程式改變component內的背景顏色，過程不免是在component上加入一些binding的方式來動態改變component的style或class。

Angular 4: 使用 setInterval

在Javascript內使用setInterval沒問題，用法基本上就是

var ref = setInterval( 'myFunction()', second * 1000);

透過這方式可以讓Javascript每 N秒執行一次 myFunction，同時會回傳一個數字到ref變數，在之後如果不需要這個 interval後，可以呼叫 clearInterval(ref)，把ref變數傳入即可清除這個interval。

在Javascript內使用沒問題，但是在Angular 4內的typescript內要怎麼使用setInterval呢？
把Javascript的寫法直接移植過去竟然沒辦法直接使用，找了一段時間，才找到方法：

首先宣告一個ref變數

intervalRef: any; this.intervalRef = setInterval(
() => { this.trigger(); }, 1000);

這樣就可以成功設定interval了，同時會傳回一個Timer，Javascript是傳回數字，但這邊卻是回傳Timer型別物件，之後如果要清除interval，方法就跟Javascript一樣了：

if (this.intervalRef != null) clearInterval(this.intervalRef);

也許Angular 4也有提供根AngularJs一樣的$interval服務，但目前還未學到，所以暫時就以這方式使用了。

Angular 4: Components & Databinding deep dive

這次紀錄一些額外的databinding與component資料傳遞相關的方法。

Angular 4：Directive

這邊記錄幾個Angular 的directive使用方法：
分別為

1. ngIf
2. ngIf-else
3. ngStyle
4. ngClass
5. ngFor

Angular 4：Data Binding

Angular data bnding 有以下幾種data binding方式：

String Interpolation
String Interpolation是可以將程式的變數輸出至template中顯示，使用方式是將變數或是function放在{{ 變數/function }}，即可讓變數顯示在template上。

Angular 4： Component

建立component

透過
ng g c comp1(Component名稱)
指令會在目錄下建立一個目錄，名稱為ComponentName，同時會建立幾個相關檔案，
檔名以Component名稱開頭，