angularjs $location 服务

简介:
<!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':'20'});
    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 #000 solid; margin:20px;}
#parent ul{ width:200px; position:fixed; top:0; right:0;}
</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>
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/5742154.html,如需转载请自行联系原作者

相关文章
|
Java 决策智能
ACM刷题之路(十)博弈论 jack & rose
ACM刷题之路(十)博弈论 jack & rose
152 0
|
数据库
Mogo数据库的简单操作
Mogo数据库的简单操作
405 0
|
Oracle 关系型数据库 数据库
oracle 恢复表语句
oracle 恢复表语句
|
算法 C++
【C/C++学院】0825-类模板/final_override/类模板与普通类的派生类模板虚函数抽象模板类/类模板友元/位运算算法以及类声明/Rtti 实时类型检测/高级new创建/类以及函数包装器
<p></p> <h2> <span style="font-family:宋体; font-size:16pt">类模板</span><span style="font-family:宋体; font-size:16pt"></span> </h2> <p></p> <p>类模板多个类型默认类型简单数组模板</p> <pre name="code" class="java">#p
1346 0
|
6天前
|
人工智能 运维 安全
|
4天前
|
人工智能 异构计算
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
|
5天前
|
机器学习/深度学习 人工智能 自然语言处理
B站开源IndexTTS2,用极致表现力颠覆听觉体验
在语音合成技术不断演进的背景下,早期版本的IndexTTS虽然在多场景应用中展现出良好的表现,但在情感表达的细腻度与时长控制的精准性方面仍存在提升空间。为了解决这些问题,并进一步推动零样本语音合成在实际场景中的落地能力,B站语音团队对模型架构与训练策略进行了深度优化,推出了全新一代语音合成模型——IndexTTS2 。
558 17
|
11天前
|
人工智能 JavaScript 测试技术
Qwen3-Coder入门教程|10分钟搞定安装配置
Qwen3-Coder 挑战赛简介:无论你是编程小白还是办公达人,都能通过本教程快速上手 Qwen-Code CLI,利用 AI 轻松实现代码编写、文档处理等任务。内容涵盖 API 配置、CLI 安装及多种实用案例,助你提升效率,体验智能编码的乐趣。
909 109