在普通的html网页中,我们可以通过在url后边添加  #elementid 的方式,将页面显示定位到某个元素,也就是锚点。

但是在angularjs应用的网页中,页面路由的写法是 #route/route   锚点的写法会被当做一个页面路由解析过去,达不到定位的目的。

angular提供一个$anchorScroll  用来做锚点的功能。

用法如下:

$scope.goto = function (id) {
$location.hash(id);
$anchorScroll();
}

  

进入页面时或者触发某操作时调用 goto('id') 即可

angularjs 锚点操作服务 $anchorScroll的更多相关文章

  1. [译]AngularJS中DOM操作

    再翻译一篇干货短文,原文:AngularJS jQuery 虽然Angularjs将我们从DOM的操作中解放出来了,但是很多时候我们还是会需要在controller/view加载之后执行一些DOM操作 ...

  2. angularJs,ionic字符串操作

    1.首先我们需要把一段"文本或字符串"中的我们想进行操作的"字符串","字"筛选出来,代码如下: app.filter('replaceCo ...

  3. AngularJS学习--- 动画操作 (Applying Animations) ngAnimate step 12

    1.切换目录 git checkout step-12 npm start 2.效果图 这里在点击右边的缩略图时,会有一个很明显的从下向上的动画过程. 3.代码实现: step11和step12之间的 ...

  4. AngularJS中实现日志服务

    本篇体验使用AngularJS自定义一个记录日志的服务. 在AngularJS中,服务的一些写法是这样的: var app = angular.module('app',[]); app.provid ...

  5. angularJS中如何写服务

    服务的用途 服务提供了一种能在应用的整个生命周期内保持数据的方法,它能够在控制器之间进行通信,并且能保证数据的一致性 服务提供了把特定功能相关联的方法集中在一起的接口 如何创建服务 angularJS ...

  6. AngularJS——第8章 服务

    第8章 服务 服务是一个对象或函数,对外提供特定的功能. 8.1 内建服务 1. $location是对原生Javascript中location对象属性和方法的封装. // $location内置服 ...

  7. angularJS module里的'服务'

    首先,为了举栗子,先写好如下的模型,控制器,html: html: <!DOCTYPE html> <html ng-app="serviceApp"> & ...

  8. 自定义AngularJS中的services服务

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  9. AngularJs(Part 3)--注册服务

    有以下5中方法注册一个AngularJS可以识别的Service value和constant是两个极其简单的方法,只有少数情况下会使用. service已经开始复杂了起来.而factory是我认为既 ...

随机推荐

  1. 基于注解的Spring AOP入门、增强Advice实例

    这篇文章简单通过一个例子,介绍几种增强的基本配置,以方便spring框架初学者对aop的代码结构有个清楚的了解认识.首先,spring支持aop编程,支持aspectJ的语法格式来表示切入点,切面,增 ...

  2. eclipse tomcat add and remove工程异常

    1  eclipse导入工程后,右击server add and remove工程时,there are no resource: 解决方案:右击工程->单击property->选择pro ...

  3. <十二>JDBC_批量处理

    import java.sql.Connection;import java.sql.PreparedStatement;import org.junit.Test;import com.kk.jdb ...

  4. MySQL选择合适的数据类型

    一.char和varchar char是固定长度的,查询速度比varchar速度快的多.char的缺点是浪费存储空间. 检索char列时,返回的结果会删除尾部空格,所以程序需要对为空格进行处理. 对于 ...

  5. How Long Does It Take

    好长时间没写博客了,真心惭愧啊! 废话少说,原题链接:https://pta.patest.cn/pta/test/1342/exam/4/question/24939 题目如下: Given the ...

  6. DoTween 应用设置

    一.下载 官方下载地址:http://dotween.demigiant.com/download.php 二.安装 1.把下载到压缩包中的DOTween文件夹拷贝到项目文件中 2.安装DOTween ...

  7. NSTimer整理总结

    对于定时器NSTimer,我们大家都不会陌生,在使用的时候,我们常常会遇到一些坑,例如:在Scrollview拖动时,timer会暂停:在子线程中如何创建一个定时器等.针对于一些我们所遇到的坑,我来总 ...

  8. android——HttpUrlConnection

    前面了解了下服务端和客户端的相关知识 ,那么他们是通过什么来进行进行连接的呢? Android可以用HttpURLConnection或HttpClient接口来开发http程序.在Android 上 ...

  9. final关键字(final是最终的)

    final关键字(final是最终的) 1.final修饰特点 a.修饰类,类不能被继承 b.修饰变量,变量就变成了常量, 修饰基本数据类:final int num = 10; 修饰引用数据类型变量 ...

  10. 【实战Java高并发程序设计 2】无锁的对象引用:AtomicReference

    AtomicReference和AtomicInteger非常类似,不同之处就在于AtomicInteger是对整数的封装,而AtomicReference则对应普通的对象引用.也就是它可以保证你在修 ...