EmberJS
TODO:這邊不知道在寫什麼，需要重新改寫。
-
Navigation
使用router完成導覽的功能。
-
Auto-updating templates
當資料有異動時，會自動更新。
-
Data handling
所有物件皆繼承Ember Object。
-
Asynchronous behavior
-
一定要有ApplicationController，否則無法產生動態樣版。
-
Router繼承StateManager類別。
-
StateManger主要追蹤目前活動狀態，以及狀態改變時，觸發callback。
-
Router任務是為了從URL找出對映的應用程式狀態。
-
*Import:*使用get和set兩個method存取Model屬性，以保持資料同步性。
-
EmberJS三個特色中，其中有兩個都在Model裡，分別是自動更新樣版綁定(binding)和計算屬性(computed properties)。
-
Binding作用是同步兩個不同物件屬性。
-
Computed properties習慣用於結合其他屬性來產生新屬性。
-
*Import:*留意Model的屬性，有Binding字尾結束，EmberJS會自動建立綁定屬性。
-
Mixin是定義一連串函式作為型態的物件，用於多重繼承。
-
可以使用Observer方式去監看屬性異動。
-
EmberJS的Controllers分成三類：
- ArrayController: 使用content屬性來管理物件集合。
- ObjectController: ObjectController很像ArrayController，但只操作單一個物件。
- Controller: 不是代理，換言之，Controller不當作物件或陣列。
-
Handlebars是EmberJS預設的樣版引擎，延伸至mustache templating engine。
-
樣版可以放入：
- 運算(Expressions)
- 輸出(Outlets)
- 視圖(Views)
-
可以使用{{#with}} helper達到with block效果。
-
使用{{view}} helper增加子視圖。
-
{{view}} helpers可加入額外參數去顯示資料：
- class
- tagName
- contentBinding
-
Handlebars可以從不同範圍、不同部份顯示元素：
- Controller
- View
- Context
title from controller: {{controller.title}}
title from view: {{view.title}}
title from context: {{titl}}
-
Ember.View含有數個屬性去建立不同型態視圖。
- tagName
- classNames
- classNameBindings
- attributeBindings
-
當下列三個原因發生會改變應用程式狀態：
- 從任何一個視圖來引發事件
- 第一次載入頁面或改變URL
- 資料更改觸發Oberver和Listener連結
-
Handlebars有{{outlet}} helper顯示回應狀態改變的頁面。
-
EmberJS允許用.property()將函式作為屬性使用。
-
觸發@each屬性時機：
- 任何在content陣列的物件屬性改變
- 從content陣列新增或移除item
- content陣列設定不同陣列
-
Ember.Componet是Ember.View子類別。
-
view's hooks的生命週期
- willInsertElement: 在render view時，element尚未插入DOM前呼叫此hooks，因此還不能使用element。
- didInsertElement: 當element插入至DOM後，呼叫此hook，這時可以使用element。
- willDestroyElement: element從DOM移除前，呼叫此hook。
- willRerender: 重新render時呼叫。
- becameVisible
- becameHidden
-
可以用
view.on()攔住hooks。
view.on('willRerender',function(){
// do something with view
});