<h1>注入依賴
<body ng-app="app" ng-controller="xmgController">
<p>{{name}}</p>
<script src="angular-1.5.8.js"></script>
<script>
// 1.創(chuàng)建模塊
var app = angular.module('app',[]);
// 2.創(chuàng)建控制器
// 行內(nèi)式注入
// []代表要導(dǎo)入的依賴,最后的回調(diào)函數(shù)就是導(dǎo)入之后給你傳遞的參數(shù)
app.controller('xmgController',['$scope',function (a) {
a.name = 'xmg';
}]);
//注入依賴格式app.controller('xmgController',['$scope','$location',function ($scope,$locale) {
// console.log($locale.absUrl());
//格式
}]);
// 2.推斷式,此方法不推薦
// 在后面做代碼構(gòu)建的時(shí)候會將代碼壓縮,壓縮的時(shí)候會把函數(shù)的形參改成一個(gè)字母
app.controller('xmgController1',function ($scope) {
$scope.name = 'app';
})
</script>
<h1>angular 中 $location, $timeout和$interval, $filter, $log, $http 概念
// $log服務(wù):服務(wù)是一個(gè)對象或函數(shù)，對外提供特定的功能.
// 內(nèi)建服務(wù):
// 1: $location是對原生Javascript中l(wèi)ocation對象屬性和方法的封裝。
// 2: $timeout&$interval對原生Javascript中的setTimeout和setInterval進(jìn)行了封裝。
// 3: $filter(過濾器)在控制器中格式化數(shù)據(jù)。
// 4: $log打印調(diào)試信息
// 5: $http用于向服務(wù)端發(fā)起異步請求。
// 6: 同時(shí)還支持多種快捷方式如$http.get()、$http.post()、$http.jsonp。
<h2>以后用最好都用angular封裝的對象,使用原生會出問題的</h2>
<h1>$location服務(wù)
/*
$location == 一個(gè)完整的url
* 一個(gè)完整的網(wǎng)絡(luò)地址包括哪幾部分
* 1.協(xié)議頭
* 2.域名(ip地址)
* 3.端口號(80)
* 4.文件地址
* 5.參數(shù)
* 6.hash值(錨點(diǎn)#)
// 在angular中不建議使用js的原生對象,有可能造成綁定數(shù)據(jù)失敗
//建議使用angular封裝的對象
for (key in location){
console.log(key + '-----' + location[key]);
}
*/
<title>04-$location服務(wù)</title>
</head>
<body ng-app="app" ng-controller="xmgController">
<script src="angular-1.5.8.js"></script>
<script>
// 1.創(chuàng)建模塊
var app = angular.module('app',[]);
// 2.創(chuàng)建控制器
app.controller('xmgController',['$scope','$location',function ($scope,$location) {
console.log($location);
console.log($location.absUrl());
// 獲取錨點(diǎn)之后的內(nèi)容
console.log($location.url());
// 獲取第二個(gè)錨點(diǎn)之后的內(nèi)容
console.log($location.hash());
// 主機(jī)名
console.log($location.host());
// 返回當(dāng)前url的子路徑(也就是當(dāng)前url#后面的內(nèi)容,不包括參數(shù))。
console.log($location.path());
console.log($location.search());
}]);
</script>
<h1>$log 了解就行不常用
<title>05-$log服務(wù)</title>
</head>
<body ng-app="app" ng-controller="xmgController">
<script src="angular-1.5.8.js"></script>
<script>
// 1.創(chuàng)建模塊
var app = angular.module('app',[]);
// 2.創(chuàng)建控制器
app.controller('xmgController',['$scope','$log',function ($scope,$log) {
$log.info('普通信息');
$log.warn('警告信息');
$log.error('錯(cuò)誤信息');
$log.log('打印信息');
$log.debug('調(diào)試信息');
//F12打印中可以看到結(jié)果
}]);
</script>
<h1>$timeout 一次定時(shí)器
//創(chuàng)建一次定時(shí)器
<body ng-app="app" ng-controller="zjController">
<p>{{msg}}</p>
<script src="angular.js"></script>
<script>
var app = angular.module('app',[]);
app.controller("zjController",['$scope','$timeout',function ($scope,$timeout) {
$scope.msg = 'xmg121';
$timeout(function () {
$scope.msg = 'hello'
},2000);
//angular中清楚定時(shí)器
var timerout = $timeout(function (regs) {
$scope.msg = 'hello';
alert(regs);
},2000,false,'a');
$timeout.cancel(timerout);
// 銷毀定時(shí)器($timeout.cancel(timerout);)
//原生定時(shí)器(在angular中會出錯(cuò),不這樣寫)
setTimeout(function (rgs) {
$scope.msg = 'hello';
console.log('rgs');
},2000,false,a);
定時(shí)器時(shí)間后面還可以傳四個(gè)參數(shù)
$timeout (fn,delay,[invokeApply],[Pass]);
fn function() 一個(gè)將被反復(fù)執(zhí)行的函數(shù)。
delay number 每次調(diào)用的間隔毫秒數(shù)值。
invokeApply boolean 如果設(shè)置為false，則避開臟值檢查，否則將調(diào)用$apply。
Pass * 函數(shù)的附加參數(shù)。
<h1> $interval 多次定時(shí)器
創(chuàng)建多次定時(shí)器
<body ng-app="app" ng-controller="zjController1">
<p>{{num}}</p>
<script src="angular.js"></script>
<script>
app.controller('zjController1',['$scope','$interval',function ($scope,$interval) {
$scope.num = 1;
var timer = $interval(function () {
$scope.num += 1;
if ($scope.num == 5){
$interval.cancel(timer);
定時(shí)器num值到5時(shí)清楚定時(shí)器 $interval.cancel(timer);
}
},1000);
// $interval(fn,delay,[count],[invokeApply],[Pass]);多次定時(shí)器也可以傳參不過比timeout多一個(gè)[count]參數(shù),代表循環(huán)的次數(shù)
fn function() 一個(gè)將被反復(fù)執(zhí)行的函數(shù)。
delay number 每次調(diào)用的間隔毫秒數(shù)值。
count number 循環(huán)次數(shù)的數(shù)值，如果沒設(shè)置，則無限制循環(huán)。
invokeApply boolean 如果設(shè)置為false，則避開臟值檢查，否則將調(diào)用$apply。
Pass * 函數(shù)的附加參數(shù)。
原生寫法是這樣的
var timer1 = setInterval(function () {
if(){
clearInterval(timer1);
}
},1000);
}])
</script>
