AngularJS $location地址服务

服务:一个对象或函数,对外提供特定的功能。


demo.html:

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>AngularJS</title>
	<script src="angular.min.js"></script>  <!-- 引入AngularJS框架 -->
</head>
<body ng-app="App">
	<dl ng-controller="DemoController">
		<dt>{{title}}</dt>
		<dd>absUrl:{{absUrl}}</dd>
		<dd>url:{{url}}</dd>
		<dd>host:{{host}}</dd>
		<dd>search:{{search}}</dd>
		<dd>hash:{{hash}}</dd>
		<dd>protocol:{{protocol}}</dd>
		<dd>port:{{port}}</dd>
	</dl>
	<script>
		
		var App = angular.module('App',[]);

		// $location 封装了对地址的服务
		App.controller("DemoController",['$scope','$location',function($scope,$location) {
			$scope.title = "学习$location服务";
			$scope.absUrl = $location.absUrl();  // 当前的地址。必须有服务器才生效
			$scope.url = $location.url();  //地址中锚点(#)后的内容 (相当于原生DOM中location对象中的hash)
			$scope.host = $location.host();  // 主机名

			$scope.search = $location.search();  //地址中锚点后的查询参数(和原生location对象的search不同)
			$scope.hash = $location.hash();  //锚点后的锚点后的内容。(两个锚点后的内容)(和原生的不同)
			$scope.protocol = $location.protocol();  // 协议 http
			$scope.port = $location.port();  // 端口

		}]);

		// 原生DOM中的location对象
		for(key in location){
			console.log(key + "----" + location[key]); //hash就是锚点(#)后的内容
		}
		
	</script>
</body>
</html>


猜你喜欢

转载自blog.csdn.net/houyanhua1/article/details/80145940
今日推荐