<!DOCTYPE HTML>

<html ng-app="myApp">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<script src="angular.min.js"></script>

<script>

//对网址信息进行2次的封装。

var m1 = angular.module('myApp',[]);

m1.controller('Aaa',['$scope','$location',function($scope,$location){

    var a = $location.absUrl();//网址的绝对地址（加的参数进行了编码）

    $location.path('aaa/bbb/ccc').replace();

    $location.hash('hello');

    $location.search({'age':''});

    var a = $location.protocol();//地址的协议

    console.log(a);

}]);

</script>

</head>

<body>

<div ng-controller="Aaa">

</div>

</body>

</html>
<!DOCTYPE HTML>

<html ng-app="myApp">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<title>无标题文档</title>

<style>

#parent div{ width:300px; height:500px; border:1px # solid; margin:20px;}

#parent ul{ width:200px; position:fixed; top:; right:;}

</style>

<script src="angular.min.js"></script>

<script>

var m1 = angular.module('myApp',[]);

m1.controller('Aaa',['$scope','$location','$anchorScroll',function($scope,$location,$anchorScroll){

    $scope.change = function(id){

        //console.log(id);

        $location.hash(id);

        $anchorScroll();//锚点跳转

    };

}]);

</script>

</head>

<body>

<div id="parent" ng-controller="Aaa">

    <ul>

        <li ng-repeat="id in [1,2,3,4,5]" ng-click="change('div'+id)">{{id}}aaaaaaaaaa</li>

    </ul>

    <div ng-repeat="id in [1,2,3,4,5]" ng-attr-id="div{{id}}">{{id}}</div>

</div>

</body>

</html>

angularjs $location 服务的更多相关文章

  1. 『AngularJS』$location 服务

    项目中关于 $location的用法 简介 $location服务解析在浏览器地址栏中的URL(基于window.location)并且让URL在你的应用中可用.改变在地址栏中的URL会作用到$loc ...

  2. Android - 位置定位(Location)服务(Service)类的基本操作

    位置定位(Location)服务(Service)类的基本操作 本文地址: http://blog.csdn.net/caroline_wendy 定位服务(Location Service),能够确 ...

  3. angualarjs $location服务

    $location服务 angular使用内置的$location服务来监听.操作url,包括以下功能: - 获取.监听.改变地址栏的URL: - 与URL实现双向数据绑定(地址栏变动.前进后退或者点 ...

  4. [AngularJS] $location 服务简介

    参考博客:  https://www.cnblogs.com/gaoruixin/p/6070502.html 简介 $location服务解析在浏览器地址栏中的URL(基于window.locati ...

  5. Android使用代码开关Location服务

    Android系统中,只有系统设置里面有入口开关位置服务.其他的应用应该怎么去开关这个服务呢? 首先,应用需要有系统权限(签名),在这基础上,我们就可以通过一些手段来实现这个功能. 这里要注意一点,不 ...

  6. --@angularjs-- $location.path('/login')-$location服务用法示例

    $httpProvider interceptor .factory('auth403', ['$rootScope', '$q', '$location', function auth403($ro ...

  7. $http服务和$location

    1.angular的$http服务跟jquery中的ajax很类似,用法如下: $http({ method : 'GET', url : 'data.php' }).success(function ...

  8. AngularJs之六（服务）

    服务:AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用.AngularJS 内建了30 多个服务. 最常用的服务:$location  服务,  $http 服务 ...

  9. 走进AngularJs(六) 服务

    今天学习了一下ng的service机制,作为ng的基本知识之一,有必要做一个了解,在此做个笔记记录一下. 一.认识服务(service) 服务这个概念其实并不陌生,在其他语言中如java便有这样的概念 ...

随机推荐

  1. linux内核（二）内核移植（DM365-DM368开发攻略——linux-2.6.32的移植）

    一.介绍linux-2.6.32: Linux-2.6.32的网上介绍:增添了虚拟化内存 de-duplicacion.重写了 writeback 代码.改进了 Btrfs 文件系统.添加了 ATI ...

  2. 日志工具全面理解及配置应用---以Log4j例子

    一．日志系统基本常识 1.日志系统作用:将日志信息输出到控制台和文本文件,以追踪代码运行信息. 2.日志系统操作的是什么?日志系统打印信息,也是调用日志系统的log.Info(),log.Warn() ...

  3. MyEclipse2014高速配置Spring &amp; Spring Testing, Spring AOP简单使用

    1.新建项目 2.右击项目,如图,利用myeclipse自己主动导入spring 3.在弹出的对话框中一直next到最后,在最后的页面中勾选Spring Testing,完毕. watermark/2 ...

  4. ubuntu 休眠之后蓝牙鼠标无效果。

    ubuntu链接蓝牙鼠标之后.左上角蓝牙标志左下角应该有一个锁的标志. 可是休眠之后,蓝牙鼠标失效,锁没有了,点击按键,出来锁之后,立即消失. 运行两次例如以下命令能够解决: sudo hciconf ...

  5. web程序定时器

    package com.timer; import java.util.Calendar; import java.util.Date; import java.util.Timer; import ...

  6. node11---相册

    app.js /* littleAlbum --.idea --controller(控制层相当于action层) --package.json --router.js --models(做事的是mo ...

  7. tensorflow入门教程和底层机制简单解说——本质就是图计算，自动寻找依赖，想想spark机制就明白了

    简介 本章的目的是让你了解和运行 TensorFlow! 在开始之前, 让我们先看一段使用 Python API 撰写的 TensorFlow 示例代码, 让你对将要学习的内容有初步的印象. 这段很短 ...

  8. transient修饰符的作用

    transient修饰符的作用: entity实体类: package com.baidu.entity; import com.fasterxml.jackson.annotation.JsonIg ...

  9. HD-ACM算法专攻系列（11）——Exponentiation

    问题描述: 源码: 考察对大数的计算,需要注意去除前导0与后导0. import java.math.BigDecimal; import java.util.*; public class Main ...

  10. webpack JS 源文件

    blob:https://www.xiaogezi.cn/49602f64-ee4a-4b4a-b0cf-c21aa3335614 /******/ (function(modules) { // w ...