[Angular.js 學習筆記] 整合 Angular 和 Firebase - AngularFire
如同 AngularFire 官方教學上所說的，AngularFire 是一個 Angular 官方支持的函式庫，可以方便進行 HTML、JavaScript、Firebase（backend） 之間的 data binding。AngularFire is the officially supported AngularJS binding for Firebase. The combination of Angular and Firebase provides a three-way data binding between HTML, JavaScript, and your Firebase backend.以下就透過一個五分鐘的範例教學，讓大家學會如何整合 Angular.js 和 Firebase：
Step 1. 引入 Angular、AngularFire 和 Firebase 函式庫
將使用到的函式庫於 <head></head> 內引入。
範例如下：
JS Bin
Step 2. 建立 Angular Module
將 firebase 定義為宣告的 Module 的 dependency。這樣一來就可以透過 Controller、Factory、Service 使用$firebase service。
範例如下：
JS Bin
Step 3. 建立 Controller
藉由傳入 $firebase 參數（dependency injection）到 Controller 的建構子中（使用 Module 寫法），可以讓 Controller 可以使用 AngularFire。
範例如下：
JS Bin
Step 4. 綁訂 Model 於 Firebase
All data stored in Firebase can be referenced by a URL.由於我們知道所有在 Firebase 上的 Data 都對應到一個獨特網址，在這邊我們使用 https://t5afpx8md5d.firebaseio-demo.com/ 當做對應網址，並生成一個 Firebase 物件。而後綁定 ng-model 和 Firebase 所對應的資料。
範例如下：
JS Bin
Step 5. 讀取資料
AngularFire will automatically update the model as needed.透過 AngularFire，我們可以運用 AngularFire 中 $asArray 的方法和 Angular Model 進行 binding，將資料自動同步，並使用 ng-repeat 將資料 render 出來。
範例如下：
JS Bin
Step 6. 寫入資料
使用 $add 方法可以將資料傳送到 Firebase ，達到同步前端和後端的效果，一個簡單的聊天功能就完成了。
範例如下：
JS Bin
That's all，相關的資訊可以進一步參考文件，記住這只是最簡單的起步走範例，我們將在接下來的文章更進一步介紹 AngularFire 的應用。
參考文件：
1. AngularFire Quickstart
Share story
