Angular 2路由和链接行为

时间:2018-01-29 07:55:22

标签: angular routes angular-ui-router router

我想询问有关角度2 - 5的路线。

我认为当我使用路由时作为单页应用程序我发现链接的行为与普通应用程序不一样导致页面没有重新加载。

当您单击页面中间的链接时,路径会更改DOM,但您将保持在页面的同一点。 (不是正常申请的顶部)

这是正常的吗?或者有什么我想念的?

2 个答案:

答案 0 :(得分:1)

这在角度5中是正常的。但是,如果您想要更改此行为,您可以收听路线更改并滚动到顶部。

Guilherme Meireles provides code for doing this

import { Component, OnInit } from '@angular/core';
import { Router, NavigationEnd } from '@angular/router';

@Component({
    selector: 'my-app',
    template: '<ng-content></ng-content>',
})
export class MyAppComponent implements OnInit {
    constructor(private router: Router) { }

    ngOnInit() {
        this.router.events.subscribe((e) => {
            if (!(e instanceof NavigationEnd)) {
                return;
            }
            window.scrollTo(0, 0)
        });
    }
}

答案 1 :(得分:0)

它&#34;正常&#34;正如你所说,Angular是一个单页面应用程序

简单来说,Angular路由允许您保持在同一页面上,并更改浏览器的行为(documentwindow对象)以适应其行为。

此行为更改为&#34;通常&#34;看网页的方式,即1个URL = 1个服务器生成的页面。

在Angular的情况下,它不是在每次更改URL时从服务器请求页面,而是在启动时请求单个页面(index.html),并使用URL更改其内容。