Angular ng-content select使用方法

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

處理 nginx close upstream connection after request

這陣子透過Nginx來作為proxy來重導連結網址，只是這陣子有人反應抓一些檔案會出現一些問題，有時可以完整抓完檔案，有時只抓一半就中斷了，時好時壞，不知什麼原因。

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

透過Javascript關閉jQuery colorbox

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

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

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名稱開頭，

Git 學習筆記

這裡記錄透過Git command line操作Git的筆記。

Angular CLI 基本使用

安裝Angular-CLI

電腦上必須安裝Nodejs，才能安裝AngularCLI，
安裝NodeJs可至官網下載最新版本，更新NodeJs也是從官網下載最新版本即可

Node.js更新方法

在Mac上可以使用以下方式更新Node.js，主要是透過 n 來達到更新的目的，但Windows系統似乎不確定是否可以這麼做。