1.AngularJS中路由實(shí)現(xiàn)的原理?
路由功能主要是 $routeProvider服務(wù) 與 ng-view 實(shí)現(xiàn),ng-view相當(dāng)于提供了頁面模板的掛載點(diǎn)蛉幸,當(dāng)切換URL進(jìn)行跳轉(zhuǎn)時(shí)漱抓,不同的頁面模板會(huì)放在ng-view所在的位置; 然后通過 routeProvider 配置路由的映射善绎。
一般主要通過兩個(gè)方法:
when():配置路徑和參數(shù);
otherwise:配置其他的路徑跳轉(zhuǎn)料滥,可以想成default呆万。
when的第二個(gè)參數(shù):
controller:對(duì)應(yīng)路徑的控制器函數(shù)冕屯,或者名稱
controllerAs:給控制器起個(gè)別名
template:對(duì)應(yīng)路徑的頁面模板桐早,會(huì)出現(xiàn)在ng-view處,比如"<div>xxx</div>"
templateUrl:對(duì)應(yīng)模板的路徑逊笆,比如"src/xxx.html"
resolve:這個(gè)參數(shù)著重說下栈戳,該屬性會(huì)以鍵值對(duì)對(duì)象的形式,給路由相關(guān)的控制器綁定服務(wù)或者值难裆。然后把執(zhí)行的結(jié)果值或者對(duì)應(yīng)的服務(wù)引用子檀,注入到控制器中。如果resolve中是一個(gè)promise對(duì)象乃戈,那么會(huì)等它執(zhí)行成功后褂痰,才注入到控制器中,此時(shí)控制器會(huì)等待resolve中的執(zhí)行結(jié)果症虑。
redirectTo:重定向地址
reloadOnSearch:設(shè)置是否在只有地址改變時(shí)缩歪,才加載對(duì)應(yīng)的模板;search和params改變都不會(huì)加載模板
caseInsensitiveMatch:路徑區(qū)分大小寫
路由有幾個(gè)常用的事件:
$routeChangeStart:這個(gè)事件會(huì)在路由跳轉(zhuǎn)前觸發(fā)
$routeChangeSuccess:這個(gè)事件在路由跳轉(zhuǎn)成功后觸發(fā)
$routeChangeError:這個(gè)事件在路由跳轉(zhuǎn)失敗后觸發(fā)
2.AngularJS 創(chuàng)建模塊
AngularJS支持模塊化的方法。模塊用于單獨(dú)的邏輯表示服務(wù)谍憔,控制器匪蝙,應(yīng)用程序等,并保持代碼的整潔习贫。我們?cè)趩为?dú)的js文件中定義的模塊逛球,并將其命名為按照module.js文件形式。在這個(gè)例子中沈条,我們要?jiǎng)?chuàng)建兩個(gè)模塊需忿。
Application Module?- 用于初始化控制器應(yīng)用程序
Controller Module?- 用于定義控制器
3、CSS雪碧圖蜡歹?
CSS雪碧 即CSS Sprites屋厘,也有人叫它CSS精靈,是一種CSS圖像合并技術(shù)月而,該方法是將小圖標(biāo)和背景圖像合并到一張圖片上汗洒,然后利用css的背景定位來顯示需要顯示的圖片部分。