directive指令間的交互
directive指令依賴
- require:'^girl'自己身上找找不到向上找，找到則會在link函數(shù)的第四個參數(shù)增加girl控制器的實例
- require:'^?girl'如果沒有依賴到使用的是? 則得到的值是null，否則報錯
app.directive('loveMoney',function () {
return {
require:'^?girl',
link: function (scope,element,attrs,girlCtrl) {
girlCtrl.add('loveMoney');
}
}
});
opener組demo
樣式：
.title{
width: 100px;
height: 30px;
line-height: 30px;
background: yellow;
}
.content{
width: 100px;
height: 100px;
background: red;
}
增加指令組：
<group>
<opener title="標題1">這是內(nèi)容1</opener>
<opener title="標題2">這是內(nèi)容2</opener>
</group>
增加引用模板：
<div class="title" ng-click="show()">{{title}}</div>
<div class="content" ng-show="flag" ng-transclude></div>
增加指令
app.directive('group', function () {
return {
controller: function ($scope) {
var arr = [];
this.add = function (scope) {
arr.push(scope);
}
this.close = function (scope) {
for(var i = 0; i<arr.length;i++){
if(arr[i]!=scope){
arr[i].flag = false;
}
}
}
}
}
});
app.directive('opener',function () {
return {
templateUrl:'open.html',
transclude:true,
require:'^group',
scope:{
title:'@'
},
link:function(scope,element,attrs,groupCtrl){
scope.flag = false;
scope.show = function () {
scope.flag = !scope.flag;
groupCtrl.close(scope);
};
groupCtrl.add(scope);
}
}
});
angular方法
$watch(watchExpression, listener, objectEquality)
監(jiān)聽模型變化
$scope.$watch(function() {
return $scope.foo;
}, function(newVal, oldVal) {
console.log(newVal, oldVal);
});
watchExpression：監(jiān)聽的對象，它可以是一個angular表達式如'name',或函數(shù)如function(){return $scope.name}。
listener:當watchExpression變化時會被調(diào)用的函數(shù)或者表達式,它接收3個參數(shù)：newValue(新值), oldValue(舊值), scope(作用域的引用)
objectEquality：是否深度監(jiān)聽，如果設(shè)置為true,它告訴Angular檢查所監(jiān)控的對象中每一個屬性的變化. 如果你希望監(jiān)控數(shù)組的個別元素或者對象的屬性而不是一個普通的值, 那么你應(yīng)該使用它
$apply
AngularJS外部的控制器（DOM 事件、外部的回調(diào)函數(shù)如 jQuery UI 空間等）調(diào)用了AngularJS 函數(shù)之后，必須調(diào)用$apply。即不是angular自帶的方法，數(shù)據(jù)更新不會影響視圖在這種情況下，你需要命令 AngularJS刷新自已。
$http
我們可以使用內(nèi)置的$http服務(wù)直接同外部進行通信。$http服務(wù)只是簡單的封裝了瀏覽器原生的XMLHttpRequest對象,用法同jquery
$http服務(wù)是只能接受一個參數(shù)的函數(shù)，這個參數(shù)是一個對象，包含了用來生成HTTP請求的
配置內(nèi)容。這個函數(shù)返回一個promise對象，具有success和error兩個方法。返回一個promise對象
var promise=$http({
method:'GET',
url:"data.json"
});
由于$http方法返回一個promise對象，對象中有一個then方法來處理回調(diào)，方法中有兩個參數(shù)，第一個是成功的回調(diào)第二個是失敗的回調(diào)
$http.jsonp(
$sce.trustAsResourceUrl(
'https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd='+$scope.query),
{jsonpCallbackParam: 'cb'})
.then(
function (res) { //成功
$scope.arrs = res.data.s;
},
function (err) { //失敗
console.log(err);
});
