2、路由
href錨點(diǎn)由 #/index –> #!/index 多了一個(gè)!號(hào)，如果不想在每一個(gè)標(biāo)簽href都寫!，要通過(guò)$locationProvider配置hashPrefix（\\\’\\\’）前綴為空
3、跨域
要設(shè)置白名單，提前把你想要的跨域的域名填寫到指定位置,設(shè)置白名單后就不需要callback參數(shù)的設(shè)置
eg:
白名單操作
app.config(\\\’$sceDelegateProvider\\\’,[\\\’$sceDelegateProvider\\\’, function(){
$sceDelegateProvider.resourceUrlWhiteList([\\\’self\\\’, \\\’http://localhost/api/**\\\’]);
}])
【AngulaarJS】(ng)
1、4個(gè)特性：MVC 模塊化 自動(dòng)化雙向數(shù)據(jù)綁定 指令系統(tǒng)
2、所有需要ng管理的代碼（容器）必須被包裹在一個(gè)ng-app指令的元素（Angular應(yīng)用程序管理的邊界）中，對(duì)包裹在內(nèi)的ng指令進(jìn)行分析和操作 ng-xxx屬性稱之為指令(directive)
3、模塊化編程基本思想步驟（這里的步驟指的是單向綁定，即模型數(shù)據(jù)展示給視圖）
(1)創(chuàng)建一個(gè)模塊 var app = angular.module("模塊名稱","該模塊依賴的其他模塊名稱（沒(méi)有依賴就寫"[]"）");
(2)把模塊名稱賦值給ng-app（劃分的邊界）
(3)通過(guò)該模塊創(chuàng)建出一個(gè)控制器(controller) app.controller("DemoController(控制器名稱)",function($scope 該參數(shù)寫死){$scope.user = {} …})這里的$scope就是數(shù)據(jù)庫(kù)，可以把里面的數(shù)據(jù)、行為暴露給視圖
(4)把該控制器賦值給邊界標(biāo)簽的 ng-controller
4、angular.module注意細(xì)節(jié)
**傳入一個(gè)參數(shù)是獲取模塊（前提有這個(gè)模塊）傳入兩個(gè)參數(shù)是創(chuàng)建模塊，如果沒(méi)有這個(gè)模塊而且也沒(méi)有填寫第二個(gè)參數(shù)"[]"那么就會(huì)報(bào)錯(cuò)
【MVC】
1、只是一種應(yīng)用程序的開發(fā)思想，不是設(shè)計(jì)模式
Model: 處理數(shù)據(jù)和業(yè)務(wù)邏輯
View: 以友好的方式向用戶展示數(shù)據(jù)
控制器(Controller): 組織調(diào)度相應(yīng)的處理模型（注:一個(gè)模型內(nèi)可以有多個(gè)控制器，控制器之間不能嵌套）
【內(nèi)置指令(指令系統(tǒng))】
（基本）
1、ng-app 指定應(yīng)用根元素,至少有一個(gè)(邊界)
2、ng-controller 指定控制器
3、ng-model 視圖層綁定數(shù)據(jù)給模型層（雙向綁定的基礎(chǔ)）
4、ng-init 初始化數(shù)據(jù)（當(dāng)數(shù)據(jù)層沒(méi)有數(shù)據(jù)傳過(guò)來(lái)，默認(rèn)用初始化數(shù)據(jù)值 eg: ng-init="name=\\\’zs\\\’"）;
5、ng-bind 綁定模型層的數(shù)據(jù)，這樣避免在內(nèi)容中 "{{}}" 這樣格式先在頁(yè)面出現(xiàn)一次，缺點(diǎn)：每次只能綁定一個(gè)數(shù)據(jù) 用法: ng-bind="name"
6、ng-bind-template 綁定模型層多個(gè)數(shù)據(jù) 用法 ng-bind-template="{{name}} {{age}}"
（常用）
7、ng-switch 處理類似tab欄的例子，接收數(shù)據(jù)屬性，常與ng-switch-when使用,后者是指定屬性值
8、ng-src 增強(qiáng)圖片路徑，不會(huì)出現(xiàn)裂圖情況，因?yàn)閚g-不是html原本屬性
9、ng-href 增強(qiáng)地址
10、ng-class 控制類名(用法 ng-class="{類名: ture/false}")
11、ng-include 引入模板（在一個(gè)網(wǎng)站中引入多個(gè)html文件拼接在一個(gè)網(wǎng)站上，ng-include="\\\’index.html\\\’" （注意里面要加上單引號(hào)）必須要在服務(wù)器上才可以正常引入）
12、ng-disabled 表單禁用
13、ng-readonly 表單只讀
14、ng-checked 單/復(fù)選框表單選中
15、ng-selected 下拉框表單選中
16、ng-click="click($event)" 這里的$event是ng提供的類似于鼠標(biāo)事件中的e，傳遞參數(shù)
【ng-repeat的補(bǔ)充】
1、正常情況數(shù)組或者對(duì)象可以通過(guò) no-repeat="key in property" 或者 no-repeat="(index, val) in property"在元素上進(jìn)行迭代
但是遇到數(shù)組有重復(fù)的名字的時(shí)候，如[\\\’a\\\’,\\\’b\\\’,\\\’c\\\’,\\\’a\\\’]; 控制臺(tái)就會(huì)出現(xiàn)重復(fù)元素的報(bào)錯(cuò)信息，解決辦法no-repeat="key in property track by $index", track by是讓數(shù)組都有一個(gè)不重復(fù)的值進(jìn)行標(biāo)記，后面跟隨的$index只要是數(shù)組元素不重復(fù)的信息即可，如id，下標(biāo)等標(biāo)識(shí)
2、ES5新增的屬性str.startsWith/endWith】
可以通過(guò)這樣的寫法得出元素開頭的字符
eg: ng-repeat="name in arr track by $index" ng-class="{red: name.startsWith="a"}"; 這樣就實(shí)現(xiàn)全部a開頭的綁定red類名，可以實(shí)現(xiàn)查找字符查找數(shù)組內(nèi)容
【ng-model的補(bǔ)充】
1、ng-model只能給表單元素(select)進(jìn)行雙向綁定，當(dāng)給select標(biāo)簽通過(guò)ng-model綁定屬性，那么select中的option中的value值會(huì)同步到ng-model綁定的屬性上,這樣就可通過(guò)同步的值去控制一些想要的效果
eg:
<select name="" id="" ng-model="style"> <option value="red">紅色</option> <option value="green">綠色</option> </select> <div ng-class="style"></div> //當(dāng)選擇紅色時(shí)，style的值就會(huì)等于red，那么ng-class的值也會(huì)變?yōu)閞ed
【自定義指令】
1、通過(guò)模塊對(duì)象的directive方法自定義指令
app.directive("temp", function(){
/*返回一個(gè)對(duì)象,這個(gè)對(duì)象就是自定義指定的相關(guān)內(nèi)容*/
return {
restrict: "ECMA", //E: element元素 A: attribute屬性 C:class類 M: mark replace必須為true
templateUrl: "./head.html", //template:’<ul><li>列表</li></ul>’ 或者 templateUrl: ‘./head.html’
replace: true //是否替換原有標(biāo)簽（指的是html標(biāo)簽）
}
})
注: 這里的E 指的是 <temp></temp>這樣指定
A 指的是 <div temp></div>
【作用域】
1、angularJS作用域是通過(guò)html標(biāo)簽屬性中的控制器進(jìn)行嵌套，訪問(wèn)方式類似函數(shù)作用域訪問(wèn)方式
【管道符"|"】
1、在過(guò)濾器和正則表達(dá)式中都大量用到管道符概念，其作用是把管道符前面的結(jié)果，用后面的方式輸出（及前方的輸出結(jié)果為后者的輸入）
【過(guò)濾器】（就是一個(gè)方法）
1作用：就是接收一個(gè)輸入,通過(guò)某個(gè)規(guī)則進(jìn)行處理.然后返回處理結(jié)果
2、eg:
<p>{{price|currency:\\\’￥\\\’}}</p> //默認(rèn) $20.00格式 冒號(hào)后面為參數(shù)，改變單位
<p>{{date |date:\\\’yyyy-MM-dd hh:mm:ss\\\’}}</p> //默認(rèn)直接返回系統(tǒng)時(shí)間 冒號(hào)后面改變格式
<p>{{course|filter:\\\’s\\\’}}</p> //filter子串匹配 必須跟上參數(shù)去匹配數(shù)組中對(duì)應(yīng)的字符是否有相應(yīng)的參數(shù)字符
<p>{{student2|filter:{age:80}|json}}</p> //json轉(zhuǎn)換json格式
<p>{{student2|limitTo:-1}}</p> //limitTo限制個(gè)數(shù)，后面必須跟參數(shù)，可以接受負(fù)值由后往前找
<p>{{str|uppercase}}</p> //全變大寫
<p>{{str2|lowercase}}</p> //全變小寫
<p>{{num|number}}</p> //字符數(shù)字轉(zhuǎn)變成num，不接收有非數(shù)字情況 parseInt 遇到字符就終止轉(zhuǎn)換后續(xù)
<p>{{student|orderBy:\\\’age\\\’:false}}</p> //orderBy排序 true 降序 false 生序
【自定義過(guò)濾器】
1、由于過(guò)濾器是一個(gè)方法，所以需要返回一個(gè)方法，并且傳入一個(gè)參數(shù)（管道符前面的屬性）
app.filter("firstUppcase", function(){ return function(input){ return input[0].toUpperCase() input.slice(1); } })
【依賴注入】
1、是不是留意過(guò)angular.module("app", []) 或者自定義控制器時(shí)也有這樣寫法，這里的"[]"就是指該模塊或者控制器需要依賴的服務(wù)是什么
2、依賴注入分為
行內(nèi)注入（開發(fā)推薦使用）: app.controller("Controller2", ["$scope", "$http", function($scope, $http){…}])
推斷注入（不推薦）: app.controller("Controller2", function($scope, $http){…})
這里的參數(shù)是ng提供的通過(guò)自身尋找ng是否存在這種服務(wù)的一種方法
缺點(diǎn):在代碼進(jìn)行壓縮的時(shí)候，函數(shù)的參數(shù)可能會(huì)被壓縮成a,b，但用行內(nèi)注入，后面跟上是一個(gè)數(shù)組，代碼壓縮過(guò)程不會(huì)把數(shù)組內(nèi)容進(jìn)行壓縮
【服務(wù)】
1、常見(jiàn)內(nèi)置服務(wù)
$location 地址欄
$timeout $interval 定時(shí)器服務(wù)
$filter 過(guò)濾器服務(wù)（不要在視圖直接用過(guò)濾器處理數(shù)據(jù)）–> $filter(\\\’uppercase\\\’)
$log 控制臺(tái)服務(wù)
$http 網(wǎng)絡(luò)服務(wù)
【$location服務(wù)】
1、就是對(duì)window.location里面的方法進(jìn)行封裝
$localtion.ablUrl() 獲取絕對(duì)路徑
$localtion.url() 獲取錨點(diǎn)后面的url
$localtion.protocol() 獲取協(xié)議
$localtion.port() 端口
$localtion.path() 當(dāng)前路徑
$localtion.hash 獲取hash值（就是錨點(diǎn)后面的錨點(diǎn)）
$localtion.search 查詢字符串（就是？后面的參數(shù)）轉(zhuǎn)換成對(duì)象
【定時(shí)器服務(wù)】($timeout,$interval)
1、寫法
$timeout(function(){},time) $interval同理
2、內(nèi)置方法
$timeout.cancel(timer) 清除定時(shí)器 timer指要清除的定時(shí)器
【$http服務(wù)】（仿ajax和跨域）
1、格式(success/error位置與ajax不一樣)2、AJAX格式
$http({ url:"./mphp.php", //請(qǐng)求地址 method:"get/post", params/data:{name:"xmg", age:"10"}, //當(dāng)請(qǐng)求方式為post，請(qǐng)求頭格式改用form提交，參數(shù)提交方式 data:"name=xmg&&age=10",原因是ng默認(rèn)沒(méi)有把 //form格式（SOAP對(duì)象形式傳遞）轉(zhuǎn)換成標(biāo)準(zhǔn)json數(shù)據(jù)傳遞（RESTFUL(json串格式)） header:{‘Content-Type’: ‘application/x-www-form-urlencoded’ }, //使用post傳遞數(shù)據(jù)要設(shè)置請(qǐng)求頭 }).success(function(){ }).error(function(){})
3、jsonp格式
$http({ url:url, method:"jsonp", params:{ callBack:\\\’JSON_CALLBACK\\\’ } }).success(function (res) { alert(res); }).error(function(res){ console.log(res); });
注意事項(xiàng):
a、當(dāng)使用jsonp 并傳入?yún)?shù)時(shí)。內(nèi)部會(huì)幫你做一些處理
b、幫你自動(dòng)創(chuàng)建一個(gè)function 名稱是ng它自動(dòng)幫你取的一個(gè)名稱。angular_callback_.0
c、會(huì)幫你創(chuàng)建一個(gè)script標(biāo)簽 src="http://localhost/day5/jsonp.php?callBack=angular_callback_.0"
d、請(qǐng)示完畢時(shí)，執(zhí)行完畢時(shí)，會(huì)把結(jié)果。給success之后，自動(dòng)刪除創(chuàng)建的標(biāo)簽跟函數(shù)
【當(dāng)訪問(wèn)的地址沒(méi)有處理跨域問(wèn)題】
1.思路
$http->url沒(méi)有幫處理跨域。
$http->php->url
php->$http
解釋:
通過(guò)訪問(wèn)本地的PHP文件再去訪問(wèn)外域地址，因?yàn)榻鉀Q跨域必須要通過(guò)后臺(tái)服務(wù)器處理，所以要借助本地的PHP去處理跨域問(wèn)題
a、創(chuàng)建本地PHP文件，通過(guò)file_get_contents("外域地址");訪問(wèn)，（原因后臺(tái)沒(méi)有跨域問(wèn)題）
b、PHP文件返回訪問(wèn)回來(lái)的數(shù)據(jù)給前臺(tái)
c、前臺(tái)通過(guò)ajax請(qǐng)求訪問(wèn)本地的PHP文件回來(lái)的數(shù)據(jù)
【$watch】（三個(gè)參數(shù),第三個(gè)參數(shù)是true/false，當(dāng)?shù)谝粋€(gè)參數(shù)是監(jiān)聽(tīng)對(duì)象發(fā)生作用）
0、當(dāng)?shù)谝粋€(gè)參數(shù)是監(jiān)聽(tīng)對(duì)象，那么監(jiān)聽(tīng)的一直是一個(gè)地址，無(wú)論值是否改變，都不會(huì)更新新值舊值，如果想監(jiān)聽(tīng)對(duì)象中值得變化，就要在第三個(gè)值填true
1、$watch是一個(gè)scope的函數(shù)，用于監(jiān)聽(tīng)模型(ng-model)變化，當(dāng)你的模型部分發(fā)生變化時(shí)它會(huì)通知你
function的參數(shù)now和old是改變后的值和改變前的值，通過(guò)監(jiān)聽(tīng)這兩個(gè)值得變化可以很好的做一些時(shí)刻改變的頁(yè)面
2、用法: $scope.$watch("username", function(now, old){…}); 這里的username就是ng-model監(jiān)聽(tīng)的值
3、性能問(wèn)題
太多的$watch將會(huì)導(dǎo)致性能問(wèn)題，$watch如果不再使用，我們最好將其釋放掉。
$watch函數(shù)返回一個(gè)注銷監(jiān)聽(tīng)的函數(shù)，如果我們想監(jiān)控一個(gè)屬性，然后在稍后注銷它，可以使用下面的方式：
var watch = $scope.$watch(\\\’someModel.someProperty\\\’, callback); watch(); //執(zhí)行返回的函數(shù)取消監(jiān)視
【自定義服務(wù)】（一般用第二種方式service）
1、factory
app.factory(\\\’formatePar\\\’,[\\\’\\\’,function(){return}]);
2、service
app.service(\\\’formatePar\\\’,[\\\’\\\’,function(){this.fun = …}]);
3、value（相當(dāng)于全局定義常量）
app.value(\\\’version\\\’,\\\’1.0\\\’);
【配置塊】
1、在每一個(gè)服務(wù)當(dāng)中都會(huì)有一個(gè)provider來(lái)對(duì)指定的功能進(jìn)行配置,改變一些系統(tǒng)的默認(rèn)行為。
2、用法config() –> 直接在對(duì)應(yīng)服務(wù)后面加Provider eg: $filterProvider
app.config([\\\’$logProvider\\\’,function ($logProvider) { $logProvider.debugEnabled(false); }]);
【運(yùn)行塊】
1、一進(jìn)入ng解析階段，程序一進(jìn)來(lái)就會(huì)執(zhí)行
2、用法run() ($rootScope為跟作用域，類似在view層的ng-init)
app.run([\\\’$http\\\’,\\\’$rootScope\\\’,function ($http,$rootScope){…})
【hashchange】
1、window自帶監(jiān)測(cè)地址欄錨點(diǎn)的變化情況
【錨點(diǎn)后面地址更新不刷新原理】
http://runoob.com/#/first http://runoob.com/#/second http://runoob.com/#/third
1、當(dāng)我們點(diǎn)擊以上的任意一個(gè)鏈接時(shí)，向服務(wù)端請(qǐng)的地址都是一樣的 (http://runoob.com/)。 因?yàn)?# 號(hào)之后的內(nèi)容在向服務(wù)端請(qǐng)求時(shí)會(huì)被瀏覽器忽略掉。所以我們就需要在客戶端實(shí)現(xiàn) # 號(hào)后面內(nèi)容的功能實(shí)現(xiàn)。
【路由】(在1.2版本之后很多功能獨(dú)立出來(lái)包括路由)
0、API：$routeProvider.when(\\\’/index/:id\\\’) (控制錨點(diǎn)參數(shù)更換模板，冒號(hào)后面為參數(shù)固定格式)
$routeParams （獲取錨點(diǎn)后面的參數(shù)，要通過(guò)注入控制器）
1、在angular當(dāng)中路由就是錨點(diǎn)用來(lái)做單頁(yè)面應(yīng)用程序的切換。錨點(diǎn)的變化，我們又稱為路由的變化。
2、用路由做單頁(yè)面的基本操作
a、在創(chuàng)建模塊時(shí)，注入路由模塊
var app = angular.module(\\\’app\\\’,[\\\’ngRoute\\\’]);
b、配置路由
app.config([\\\’$routeProvider\\\’,function ($routeProvider) { /*當(dāng)錨點(diǎn)為指定值時(shí)， 幫你處理相應(yīng)的邏輯 * 路由規(guī)定，在路徑之前， 加上一個(gè)"/" * */ $routeProvider.when(\\\’/index\\\’,{ template:"<h1>首頁(yè)</h1>" }) .when(\\\’/music\\\’,{ template:"<h1>音樂(lè)</h1>" }) .when(\\\’/singer\\\’,{ template:"<h1>首頁(yè)</h1>" }).otherwise({ redirectTo:\\\’/index\\\’ }) }]);
c、在view層通過(guò)ng-view設(shè)置占位符：把模板放到哪個(gè)位置
<div class="content" ng-view></div>
【SPA和tab欄的區(qū)別】
0、盡管都是無(wú)刷新更新頁(yè)面，但運(yùn)行機(jī)理不同
1、tab欄是把所有的內(nèi)容固定在dom樹上（同步冗余）
SPA是通過(guò)異步獲取數(shù)據(jù)添加到對(duì)應(yīng)的節(jié)點(diǎn)上
【修飾符\\\’@\\\’和修飾符\\\’=\\\’】
1、在自定義指令當(dāng)中，通過(guò)scope屬性中的對(duì)象暴露出一個(gè)接口讓外界的父級(jí)控制器可以傳入一個(gè)常量或者變量進(jìn)行控制子級(jí)的變量
用法:
scope:{
子級(jí)的變量名: "@暴露給外界的名字"
}
在
<body ng-app="app" ng-controller="xmgController"> <input type="text" ng-model="name"> <div tag msg="{{name}}"></div> //這里的tag就是子級(jí)控制器控制范圍,msg就是暴露出來(lái)的接口 </body>
2、為什么要暴露接口？
答:其實(shí)不暴露接口子級(jí)可以控制父級(jí)，父級(jí)也可以控制子級(jí)的變量，但是這樣只能通過(guò)父子級(jí)相同屬性名才可以控制，而通過(guò)修飾符的方法暴露一個(gè)接口，就可以靈活的讓不同父級(jí)控制器去控制子級(jí)的屬性，而不必要全部相同的屬性名（父級(jí)只要通過(guò)接口傳遞即可），做法更靈活
3、\\\’@\\\’、\\\’=\\\’的區(qū)別？
答:\\\’@\\\’只能通過(guò)父級(jí)傳遞數(shù)據(jù)給子級(jí)呈現(xiàn)，屬于單向傳遞， 而\\\’=\\\’屬于雙向傳遞，誰(shuí)修改屬性都會(huì)互相影響
【廣播】（查NG參考手冊(cè)）
1、通過(guò)指令父級(jí)呼喚子級(jí)干事，或者子級(jí)呼喚父級(jí)干事
2、發(fā)送廣播時(shí)，一定要等指令加載完畢之后，才去發(fā)送廣播
【$q服務(wù)】（有類似回調(diào)，查NG參考手冊(cè)）
1、用于創(chuàng)建延時(shí)任務(wù)
【PhpStrome】
1、類似WebStrome，但內(nèi)置php服務(wù)器，可以直接打開Php文件進(jìn)行訪問(wèn)，前提要配置php服務(wù)
【PHP基本寫法】
$_GET[\\\’name\\\’]; //接收get請(qǐng)求過(guò)來(lái)的name
$_POST[\\\’name\\\’]; //接收post請(qǐng)求過(guò)來(lái)的name
echo //輸出
$array = [\\\’name\\\’=>\\\’xmg\\\’,\\\’age\\\’=>10]; //PHP寫json寫法
json_encode($array); //轉(zhuǎn)成標(biāo)準(zhǔn)json格式
file_get_contents("file.json") //PHP接收json文件（拿外域地址數(shù)據(jù)）
echo $fn."()"; //$fn為前端傳過(guò)來(lái)的函數(shù)體,通過(guò)PHP語(yǔ)法.拼接括號(hào)才能進(jìn)行調(diào)用
【用ng配合gulp完成的項(xiàng)目webApp注意點(diǎn)】(模塊化開發(fā)體驗(yàn))
零、移動(dòng)端刷新】
1、ctrl r 強(qiáng)刷新
一、rem操作】
0、添加<meta name="viewport" content="width=device-width maximum-scale=1.0 minimum-scale=1.0 user-scalable=no">
1、修改視口比例需要在js代碼中添加
var font = window.screen.width / 20 "px"; //獲取不同窗口的寬度，取20的比例
document.getElementsByTagName("html")[0].style.fontSize = font; //把比例賦值給html根標(biāo)簽
二、像素轉(zhuǎn)為rem格式】
0、一般引入一個(gè)把所用到rem的地方都定義的類，在index.less中通過(guò) @import \\\’url.less\\\’引入
1、unit指把數(shù)值以什么單位輸出，用法unit(5,rem) –> 5rem
/*把像素轉(zhuǎn)成rem*/
.fs(@px){
font-size: unit(@px/37.5,rem);
}
三、src的js文件夾】
1、一般定義config、controller、directive、service四個(gè)文件夾去存放對(duì)應(yīng)的函數(shù),在問(wèn)最外層創(chuàng)建app.js定義模塊
四、src中的view文件夾】
1、把每一個(gè)整體的頁(yè)面分拆成一個(gè)個(gè)小的零件，如頭部有專門的只負(fù)責(zé)傳文字?jǐn)?shù)據(jù)，有專門的模板去展示
五、自定義指令注意事項(xiàng)】
1、app.directive(\\\’listView\\\’, function(){…})
–> 在html定義的屬性或者標(biāo)簽名字為list-view才生效
六、應(yīng)用程序可擴(kuò)展性】(應(yīng)用場(chǎng)景$http)（httpTool.js）
1、原因:自己的項(xiàng)目不能由第三方插件牽著走，當(dāng)?shù)谌讲寮幸恍╆P(guān)鍵地方有作更新的時(shí)候，我們自己的項(xiàng)目很多地方就會(huì)要重新修改，如1.5.2版本的$http，success/error改為then/catch,當(dāng)你的項(xiàng)目有100個(gè)地方用到網(wǎng)絡(luò)請(qǐng)求的時(shí)候你就要改100個(gè)地方，程序可擴(kuò)展性低
2、做法:利用angular提供給我們的自定義服務(wù)，自定義一個(gè)自己的網(wǎng)絡(luò)請(qǐng)求服務(wù)，盡管第三方插件改動(dòng)了一些關(guān)鍵地方，你只要修改你自定義服務(wù)里面的一個(gè)地方即可對(duì)整個(gè)項(xiàng)目進(jìn)行修改
七、ui.router注意地方】
1、在模板位置添加ui-sref指定路由名稱相當(dāng)于定義錨點(diǎn)
2、當(dāng)要改變選中路由的樣式用ui-sref-active="類名";這個(gè)屬性去控制
八、獲取頭部信息用參數(shù)$attr.nav】
1、在html nav="內(nèi)容"設(shè)置標(biāo)簽和內(nèi)容,在自定義指令通過(guò)link: function($scope,$jqLite,$attrs){console.log($attr.nav)} //獲取內(nèi)容,達(dá)到解耦合操作
九、子頁(yè)面返回主頁(yè)面再次請(qǐng)求數(shù)據(jù)問(wèn)題】（不能返回就重復(fù)請(qǐng)求相同數(shù)據(jù)）
1、解決辦法: ui.router的子路由方法，
a、在主頁(yè)面顯示主路由通過(guò)<div ui-view></div>接收4個(gè)頁(yè)面模板
b、4個(gè)頁(yè)面模板中接收內(nèi)容數(shù)據(jù)的地方在設(shè)置一個(gè)<div ui-view></div>去接收l(shuí)ist-view模板還是detail模板
b處這樣做的原因：正常思路設(shè)置這樣一個(gè)路由會(huì)導(dǎo)致主頁(yè)面<div ui-view></div>對(duì)這兩個(gè)路由進(jìn)行來(lái)回切換，一旦切換后就會(huì)把其控制器和模板一并覆蓋，導(dǎo)致每次返回都會(huì)重新獲取一次數(shù)據(jù)
$stateProvider.state(\\\’home\\\’,{
url:\\\’/home\\\’,
templateUrl:"../view/home_tpl.html",
controller:"homeController"
}).state(\\\’detail\\\’,{
url:\\\’/detail/:id\\\’,
template:"../view/template/detail_tpl.html",
controller:"detailController"
});
c、設(shè)置路由（設(shè)置命名空間管理子路由home.list、home.detail）
$stateProvider.state(\\\’home\\\’,{
url:\\\’/home\\\’,
templateUrl:"../view/home_tpl.html",
controller:"homeController"
}).state(\\\’home.list\\\’,{
url:\\\’/list\\\’,
template:"<div list-view></div>", //由于home_tpl模板已經(jīng)用<div ui-view></div>子路由占位，只能通過(guò)這樣去添加到子路由上顯示
controller:"homeController"
}).state(\\\’home.detail\\\’,{
url:\\\’/detail/:id\\\’,
templateUrl:\\\’../view/template/detail_tpl.html\\\’,
controller:"detailController"
})
$urlRouterProvider.otherwise(\\\’home\\\’);
d、在homeController添加$state.go(\\\’home.list\\\’);
原因:在加載子路由模板第一個(gè)路由指向是列表，所以要在對(duì)應(yīng)控制器中指向home.list列表的命名空間第一次跳轉(zhuǎn)
十、控制jsonp白名單sce】
1、有時(shí)候跨域拿數(shù)據(jù)，后臺(tái)會(huì)返回err信息，信息內(nèi)容Error: [$sce:insecurl] ，這是ng的$http跨域拿數(shù)據(jù)時(shí)候$sce要設(shè)置可信任的網(wǎng)站才允許訪問(wèn)
2、操作
angular.module(\\\’app\\\’)
.config([\\\’$sceDelegateProvider\\\’,function ($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
\\\’self\\\’, //自身必寫
\\\’http://localhost/api/**\\\’ //需要跨域的網(wǎng)址
]);
}]);
十一、切換路由控制器也會(huì)切換，但定義的$scope.dataList的屬性還是繼續(xù)保留】
1、$scope.dataList得到的后臺(tái)數(shù)據(jù)可以繼續(xù)再點(diǎn)擊其他路由繼續(xù)使用
十二、數(shù)據(jù)返回詳情頁(yè)content數(shù)據(jù)為標(biāo)簽】（繞）
1、數(shù)據(jù)返回詳情頁(yè)content數(shù)據(jù)為標(biāo)簽格式，所以不能直接通過(guò)ng-bind綁定，要通過(guò)創(chuàng)建自定義標(biāo)簽detail，在自定義標(biāo)簽link方法中jq操作獲取內(nèi)容，其內(nèi)容通過(guò)html標(biāo)簽傳來(lái)的屬性detail="{{detailData}}"中獲取，這里的detailData是后臺(tái)$scope.detailData定義的
更多關(guān)于云服務(wù)器，域名注冊(cè)，虛擬主機(jī)的問(wèn)題，請(qǐng)?jiān)L問(wèn)三五互聯(lián)官網(wǎng)：www.shinetop.cn
