Ember——在構建Ember應用程序時，咱們會使用到六個主要部件：應用程序（Application）、模型（Model）、視圖（View）、模板（Template）、路由（

在構建Ember應用程序時，咱們會使用到六個主要部件：

模板（Template）、應用程序（Application）、視圖（View）、路由（Routing）、控制器（Controller）和模型（Model）。

第一步：建立index.html頁面

第二步：模板（Handlebars）

它讓開發人員能夠混合原始HTML和Handlebars表達式生成渲染相應的HTML；表達式以包括在{{}}中，咱們能夠經過兩種方法把 Handlebars模板加載到頁面中

第三步：應用程序（Application）

每一個Ember應用程序都須要一個Ember應用程序實例，接下來讓咱們在app.js中建立第一個Ember應用程序實例吧！

其實，這裏有個「潛規則」：若是咱們沒有定義ApplicationView（應用程序 視圖），那麼Ember會自動生成一個 ApplicationView而且默認加載名爲application的模板，假設，咱們把模板重命名爲application1，那麼默認的 ApplicationView將找不到要加載的模板。

固然，咱們也能夠經過定義ApplicationView來指定須要加載的模板名稱，具體實現如

第四步：路由（Routing）

{{outlet}}的內容是根據路由選擇後，動態獲取的模板內容

它能夠幫助管理應用程序的狀態和用戶導航所需資源的資源；當咱們的應用程序啓動時，路由是負責顯示模板，加載數據，以及管理應用程序的狀態。

上面，咱們定義了兩個路由分別是：應用程序的全局路由home和employee，在index頁面進行加載同時訪問home路由的模板，數據和應用程序狀態；

而employee路由將根據employee_id訪問每一個一個員工的基本信息。

接下來，咱們定義home模板，具體實現以下：

使用了each表達來迭代訪問employeeInfo對象中的元素，這時咱們又有一個疑問了，那就是employeeInfo對象從哪裏獲取呢？

第五步：控制器Controller

Controller負責從Model中獲取數據，而後經過模板加載顯示，那麼咱們能夠經過顯市定義Controller   來獲取數據，若是咱們不定義的話，Ember會自動生成一個HomeController。

上面，咱們自定義了HomeController而且初始化了employeeInfo數組，如今咱們刷新一下index頁面。

 

第六步：模型（Model）

模型是一個用來表示應用程序數據的對象，它多是一個簡單的數組或經過RESTful API動態檢索的數據；

ember-data.js爲每一個應用程序都提供存儲空間，存儲空間負責保持已加載的Model和檢索還未加載的Model。

建立程序的模型（實體）Employee，接下來咱們將實現模型的定義。

定義了Employee模型，它繼承了DS.Model而且包含三個字段分別是name，department和title。

接下來，咱們經過定義App.Employee.FIXTURES，模擬從服務器端獲取數據。