以上jquery,下面js

this.router.events.subscribe((event) => {
document.body.scrollTop=0;
});

另一种写法

import { Component, ViewEncapsulation, OnInit } from '@angular/core';
import { Router, ActivationEnd, NavigationEnd } from '@angular/router'; @Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.less','../assets/css/style.less'],
encapsulation: ViewEncapsulation.None //Emulated当前 None全局
})
export class AppComponent {
title = '数据平台';
constructor(private router: Router){ }
ngOnInit(){
this.router.events.subscribe((event:NavigationEnd) => {
if (event instanceof ActivationEnd){// 当导航成功结束时执行
document.documentElement.scrollTop = 0;
//document.body.scrollTop.scrollTop = 0;
}
});
}
}

  

  

解决angular单页面页面底部跳转到新页面滚动条不在顶部的问题的更多相关文章

  1. 问题:使用ajax跳转到新页面无效(浏览器Safari)

    问题:使用ajax跳转到新页面无效(浏览器Safari)   window.open("{% url "runtestinfo" %}")   但是使用loca ...

  2. PHP弹出提示框并跳转到新页面即重定向到新页面

    本文为大家介绍下使用PHP弹出提示框并跳转到新页面,也就是大家所认为的重定向,下面的示例大家可以参考下   这两天写一个demo,需要用到提示并跳转,主要页面要求不高,觉得没必要使用AJAX,JS等, ...

  3. react中实现点击跳转到新页面方法

    实现点击跳转到新页面,可以有两种形式,一个是本地页面打开,一个是本地页面不变跳转到新的页面. (一)页面点击本地页面打开新页面 引入ant的Button组件 <Button style={{ba ...

  4. H5如何实现关闭当前页面,跳转到新页面?

    小程序有此功能的跳转方法. 那么H5如何实现该功能?  很简单. location.replace('new.html')  这个方法可以实现 关闭当前页面,跳转到新页面 的效果. 而   windo ...

  5. vue-cli跳转到新页面的顶部

    我这里有两种方法都是可以用的 1,利用vue-router的默认模式hash,可以记录上一页的位置,如果需要点话,如果没有记录,在进入新页面的时候是返回到新页面的最顶部的 scrollBehavior ...

  6. Vue路由跳转到新页面时 默认在页面最底部 而不是最顶部 的解决

    今天碰到一个问题   vue路由跳转到新的页面时会直接显示页面最底部  正常情况下是显示的最顶部的  而且好多路由中不是全部都是这种情况  折腾好长时间也没解决  最后在网上找到了解决办法 其实原理很 ...

  7. Java web开发中页面跳转小技巧——跳转后新页面在新窗口打开

    最近学习Java web,在学习过程中想实现一个需求,就是在jsp页面跳转的时候,希望跳转后的新页面在新窗口中打开, 而不是覆盖原来的页面,这个需求使我困惑了好长时间,后来通过大海捞针似的在网上寻找方 ...

  8. vue 单页应用点击某个链接,跳转到新页面的方式

    <router-link class="goDetail" :to="{name: 'detail',params: {id:item.id}}" tar ...

  9. web.config中配置页面出错后跳转指定错误页面

    每当用户访问错误页面时,会出现不友好的404错误,所以为了防止这种不友好,我们在web.config中的<system.web>节点下配置 <customErrors>,在出现 ...

随机推荐

  1. 201871010102-常龙龙《面向对象程序设计(java)》第十六周学习总结

    项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ 这个作业的要求在哪里 https://www.cnblogs.com/nwnu-daizh/p ...

  2. acwing 835. Trie字符串统计

    地址  https://www.acwing.com/problem/content/description/837/ 维护一个字符串集合,支持两种操作: “I x”向集合中插入一个字符串x: “Q ...

  3. IT兄弟连 Java语法教程 流程控制语句 控制循环结构3

    使用continue忽略本次循环剩下的语句 continue的功能和break有点类似,区别是continue只是忽略本次循环剩下的语句,接着开始下一次循环,并不会终止循环:而break则是完全终止循 ...

  4. HTTP常见的几种认证机制

    几种常用的认证机制 ===================转自https://www.cnblogs.com/xiekeli/红心李的文章====================== 我是一个测试人员 ...

  5. Token ,Cookie、Session傻傻分不清楚?

    作者 | 王菜鸟1993 来源 | cnblogs.com/JamesWang1993/p/8593494.html 在做接口测试时,经常会碰到请求参数为token的类型,但是可能大部分测试人员对to ...

  6. FastJson中的ObjectMapper对象的使用详解

    写在前面:开发中经常用到json和对象的相互转换,下面将列出FastJson中ObjectMapper对象的API的使用 一.maven工程中pom导入<dependency> <g ...

  7. 合格的施工图是如何绘制的?必须要get这四点,大多数人都不知道

    对于工程设计师来说加班通宵赶图改图是常有的事情,如何绘制一套合格的施工图?这是很多工程设计师都会问的问题. 绘制一套合格的施工图,你需要注意以下四点: 一.明确施工图的作用和目的 1. 工程设计的细化 ...

  8. 敏捷软件开发_设计原则<三>

    敏捷软件开发_设计原则 单一职责原则(single responsibilities principle,SRP) 原理:一个类应该只有一个变化 分离职责:如果不耦合的职责那么很简单,如果两个职责耦合 ...

  9. E203 CSR rtl实现分析

    CSR状态控制寄存器,每个hart都有自己的CSR.对于每个hart,可以配置的状态寄存器是4k.CSR寄存器的功能见:https://www.cnblogs.com/mikewolf2002/p/1 ...

  10. Django 全局log process_exception中间件

    class BaseResp: # 基础的返回值类 def __init__(self, code, msg, data): self.code = code self.msg = msg self. ...