Ember 第一章對象模型小結

2018-01-06 16:50 更新

本篇之前的6篇文章都是第一章的內容,這一章節(jié)主要介紹了Ember的對象模型。其中最重要的是計算屬性和枚舉這2章,非常之重要,一定要好好掌握!

下一章節(jié)是第二章模板,Ember應用使用的模板庫是handlebar點我查看更多有關此模板的介紹),這個模板庫功能強大,有豐富的標簽,包括判斷標簽ifif else,以及遍歷標簽each等等。

另外,從下一章開始,我們不再自己手動搭建Ember項目,也不用手動引入Ember庫文件,而是使用官方提供的一個非常棒的構建工具——Ember CLI,要使用這個構建工具首先安裝并配置。下面兩個地址是介紹安裝與配置的(推薦第一個):

  1. http://www.ember-cli.com/user-guide/
  2. https://guides.emberjs.com/v2.4.0/getting-started/

Ember CLI是一個非常重要的構建工具,它可以為開發(fā)者創(chuàng)建文件并初始化部分固定的代碼。它還可以運行、打包、測試Ember應用。

下面使用這個工具創(chuàng)建一個新的Ember項目chapter2_tempalte。

  1. 新建項目命令: ember new chapter2_tempalte
  2. 進入項目目錄并啟動服務器: cd chapter2_template
    ember server
  3. 運行項目,瀏覽器打開這個鏈接:http://localhost:4200/,如果你能看到如下信息說明安裝成功了。

run proj

如果項目創(chuàng)建成功你可以繼續(xù)往下看,如果項目創(chuàng)建不成功請重試,因為后面的代碼都基于這個項目來演示的!??!對于創(chuàng)建項目后得到的每個文件和目錄請你看官網文檔,上面會有非常詳細的說明。為了方便懶人在此就簡單介紹其中幾個很重要的文件和目錄:

目錄 說明
app 項目的主要代碼都是放在這個目錄下
app/controllers 存放C(MVC)層(controller)的代碼文件
app/helpers 存放自定義的helper代碼文件
app/models 存放M(MVC)層(model)代碼文件
app/routes 存放項目路由設置代碼文件
app/templates 存放項目模板代碼文件
bower_components 存放使用bower命令安裝的第三方插件庫
bower.json 保存使用bower命令安裝的第三方庫的配置
package.json 保存使用npm命令安裝的第三方庫的配置
node_modules 存放使用npm命令安裝的第三方插件庫
ember-cli-build.js 設置構建規(guī)范,引入第三方庫
dist 存放編譯打包后的項目文件,可以直接復制到服務器中運行

上述這些文件或者目錄是后面開發(fā)過程經常會用到,相對其他目錄和文件來說這些目錄和文件是很重要的,只要你是使用ember new appName命令生成的項目都會包括上述這些目錄或者文件。其中最重要的就是app目錄下的文件、目錄了,從app里面的目錄結果你就可以很清楚的看到這是個MVC框架的項目。Ember之所以能找到controller對應的template也是根據目錄和文件的名稱找到的,Ember是有自己的一套命名規(guī)則的,如果你想了解更多有關信息請移步folder-layout

搭好環(huán)境之后開始我們的Ember之旅吧?。?!
博文完整代碼放在Github(博文經過多次修改,博文上的代碼與github代碼可能又出入,不過影響不大!),如果你覺得博文對你有點用,請在github項目上給我點個star吧。您的肯定對我來說是最大的動力??!

以上內容是否對您有幫助:
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號