-
jqLite
- 作用：
- 把一個(gè)dom節(jié)點(diǎn)轉(zhuǎn)成jq節(jié)點(diǎn)，但是只包含了jquery一部分功能。
- 如果說(shuō)已經(jīng)引入了jquery,那么使用angular.element(box);獲取的對(duì)象就是一個(gè)原生jquery對(duì)象
- 方法：
- 1.獲取dom節(jié)點(diǎn)
var box = document.querySelector('.box');
- 2.把dom節(jié)點(diǎn)轉(zhuǎn)換成jq節(jié)點(diǎn)
box = angular.element(box);
-
$watch
- $watch是$scope里面的一個(gè)方法
- 使用：$watch('$scope身上的屬性',fun(newV,oldV)){}
- 當(dāng)屬性值改變時(shí)，會(huì)自動(dòng)調(diào)用回調(diào)方法fun()。newV:屬性改過(guò)之后最新的值。oldV:屬性修改之前的值。
- 默認(rèn)情況下是不能直接監(jiān)聽(tīng)對(duì)象。如果想要監(jiān)聽(tīng)一個(gè)對(duì)象，加上第三個(gè)參數(shù)true ,為true可以監(jiān)聽(tīng)對(duì)象的變化。
- 如何取消一個(gè)watch監(jiān)聽(tīng)？
- 在調(diào)用$watch會(huì)返回一個(gè)方法。想要取消監(jiān)聽(tīng)，直接執(zhí)行返回的方法即可。
- 例子：
per是對(duì)象，name是屬性
//1.創(chuàng)建模板
var app = angular.module('app', []);
//2.創(chuàng)建控制器
app.controller('myController', ['$scope', function ($scope) {
$scope.name = 'xmg';
var count = 3;
var unWatch = $scope.$watch('per.name',function (newV,oldV) {
console.log(newV+'-----'+oldV);
count--;
if (count == 0){
unWatch(); //取消監(jiān)聽(tīng)。
}
},true); //為true可以監(jiān)聽(tīng)對(duì)象的變化
}]);
//3.綁定模塊
//4.綁定控制器
</script>
</head>
<body ng-app="app" ng-controller="myController">
<input type="text" ng-model="per.name">
<input type="text" ng-model="per.age">
<h1>{{per.name}}</h1>
<h1>{{per.age}}</h1>
- 當(dāng)name在input中發(fā)生變化的時(shí)候，newV打印出來(lái)的是發(fā)生變化的值，oldV打印出來(lái)的是之前的值（因?yàn)闆](méi)有賦值，所以是undefined）
-
$q.defer(推斷方法)
- $q是一個(gè)服務(wù)，需要注入。
- 使用：
- 1.首先創(chuàng)建一個(gè)延時(shí)服務(wù)，也就是用$q調(diào)用defer方法。
var defer = $q.defer();
- 2.推斷選擇執(zhí)行。發(fā)送網(wǎng)絡(luò)請(qǐng)求，有成功響應(yīng)，也有失敗響應(yīng)。那么就會(huì)選擇一個(gè)執(zhí)行。這時(shí)候就使用這次發(fā)送請(qǐng)求的返回值（結(jié)果），再一次發(fā)送請(qǐng)求。
//1.創(chuàng)建模板
var app = angular.module('app', []);
//2.創(chuàng)建控制器
app.controller('myController', ['$scope','$http','$q', function ($scope,$http,$q) {
var defer = $q.defer();
$http({
url:'url',
method:'get',
}).then(function (res) { //請(qǐng)求成功，獲得返回值。用返回的值再一次發(fā)送請(qǐng)求
defer.resolve(res);
}).catch(function (error) {
defer.reject(error);
});
defer.promise.then(function (res) { //上面請(qǐng)求成功對(duì)應(yīng)的再次請(qǐng)求。
//resolve
alert(res);
},function (error) {
//reject
alert('error'+error);
}).finally(function () {
//finally一定會(huì)執(zhí)行。
alert('fin');
});
}]);
//3.綁定模塊
//4.綁定控制器
</script>
</head>
<body ng-app="app" ng-controller="myController">
</body>
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成，瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點(diǎn)，簡(jiǎn)書(shū)系信息發(fā)布平臺(tái)，僅提供信息存儲(chǔ)服務(wù)。
