命名約定
我們在使用Ember.js創(chuàng)建routes,controllers和templates時,要遵循Ember.js的一些命名約定,在下面的例子中,App代表了我們的Ember應(yīng)用程序,你可以為你的應(yīng)用選擇任何你想要的名字,稍后會展示如何創(chuàng)建一個Ember應(yīng)用,但是現(xiàn)在,我們講關(guān)注命名約定
THE APPLICATION
在你的應(yīng)用啟動時,Ember會檢查下面一些對象
- App.ApplicationRoute
- App.ApplicationController
- application template
Ember.js會將application模板作為應(yīng)用的主模板進行渲染,如果程序提供了App.ApplicationController,Ember.js將會為主模板設(shè)置controller屬性,其值為App.ApplicationController對象的實例。
如果應(yīng)用提供了App.ApplicationRoute,Ember.js首先會調(diào)用router's hooks,在渲染application模板之前,
Hooks作為方法被執(zhí)行,并且提供給你竊聽和執(zhí)行代碼去修改默認行為以滿足你的需要。Ember提供了一些hooks,用來滿足你多樣化的目標(例如:model,setupController,等等),在下面的栗子中,App.ApplicationRoute實現(xiàn)了setupController hook
在Ember.js應(yīng)用中,你總是要指定你自己的controller類,框架負責實例化他們,并且將其提供給你的模板。
SIMPLE ROUTES
每一個routes有一個controller,模板和route有相同的名字。
看下面的例子:
如果用戶導航到/favorites,Ember.js會查找下面的對象。
- App.FavoritesRoute
- App.FavoritesController
- the favorites template
Ember.js會將favorites模板渲染到application模板的{{outlet}}中,它會設(shè)置App.FavoritesController對象實例作為模板的controller屬性。
如果應(yīng)用提供了App.FavoritesRoute,框架會在模板渲染前調(diào)用它,這看起來有些多余。
對于路由,例如App.FavoritesRoute,你可能會實現(xiàn)model hook去指定controller選擇什么model去呈現(xiàn)到模板中。
例如:
在這個例子中,我們沒有提供FavoritesController,因為model是一個數(shù)組,Ember.js會自動提供一個Ember.ArrayController對象實例,它會講返回的數(shù)組作為其model。
你能夠?qū)rrayController看做是他自己的model,這有兩個主要的優(yōu)勢:
- 你可以在任意時間替換掉controller的model,而不用直接去告知視圖發(fā)生的改變
- controller能夠提供額外的computed屬性或者 view-specific狀態(tài),而這些本不屬于model層
DYNAMIC SEGMENTS
如果路由使用了dynamic segment(url中包含參數(shù)),route的model將依賴用戶提供的segement的值。
考慮下面的定義:
路由的名字是post,Ember.js會查找下面的對象
- App.PostRoute
- App.PostController
- the post template
路由中的model hook會將動態(tài)的:post_id參數(shù)轉(zhuǎn)化為一個model,serialize hook會將model對象轉(zhuǎn)化為對應(yīng)的URL參數(shù),
因為這個模式很常見,他對于route handlers是默認就擁有的。
如果dynamic segment以_id結(jié)尾,默認的model hook會在應(yīng)用的命名空間上轉(zhuǎn)化第一部分為model class,接著會使用動態(tài)分段的值調(diào)用find函數(shù)。
默認serialize hook的行為是用model對象的id屬性替換掉route的dynamic segment。
ROUTE, CONTROLLER AND TEMPLATE DEFAULTS
如果你沒有為post route指定route handler,Ember.js 仍然會使用app的App.PostController實例渲染post 模板。
如果你沒有指定controller,Ember會根據(jù)route model hook的返回值類型自動的創(chuàng)建一個,如果model是數(shù)組,你將獲得ArrayController,否則,你將獲得ObjectController,
如果你沒有指定post模板,Ember.js就不會做什么事情了。
NESTING
你可以在resource之下做嵌套路由。
resource是route,controller,template的開始,即使post是嵌套的,它的route名也是App.PostRoute,它的controller名字是App.PostController,它的模板名字是post
他你再resource中嵌套了一個route,route的名字為resource.routeName
下面是命名規(guī)范:
規(guī)則是:resources使用名詞,routes使用形容詞或者動詞,這樣確保在嵌套中不會創(chuàng)建很長的名字,但是要避免使用太過通用的形容詞和動詞。
THE INDEX ROUTE
在任意層級的嵌套中(包括頂層),Ember.js會自動為/提供一個index route.
例如下面的是等效的:
如果用戶訪問/,Ember.js會查找下面的對象:
- App.IndexRoute
- App.IndexController
- the index template
index 模板會被渲染進aplication模板的{{outlet}}中,如果用戶訪問到/favorites,Ember.js會用favorites模板替換掉index模板。
嵌套路由會像下面的樣子:
如果用戶訪/posts,當前的路由是post.index,Ember.js會查找下面的對象
- App.PostsIndexRoute
- App.PostsIndexController
- The posts/index template
首先posts模板會被渲染application模板的{{outlet}}中,接著posts/index會被渲染到posts模板的{{outlet}}中。
如果用戶訪問/posts/favorites,Ember.js會將posts模板中得{{outlet}}替換為posts/favorites模板。