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服務，但目前還未學到，所以暫時就以這方式使用了。

透過Javascript關閉jQuery colorbox

原本要用window.close()可以javascript視窗，即使視窗是個popup也可行，但是最近發現透過

jquery開啟之Colorbox卻沒辦法用該方式關閉，