使用Java的Angular中的RouterLink

Question

我正在尝试使用类似于HTML中的routerLink的javascript方法，但使用Javascript。

我尝试使用window.location但结果不一样，因为此命令刷新了网站，使其从一个URL跳转到另一个URL。 是否有可能像routerLink一样从一个组件跳到另一个组件（不刷新）？

解

我在问router.navigateByUrl('/url')

Answer 1

routerLink的指令内部实现不使用window.location API，而是更精确地使用window.history API， window.history.pushState()函数（ Source ）。

每个SPA框架都一样。

Answer 2

您可以更改而无需重新加载的是window.location.hash 。 如果您不想弄乱history.pushState()也可以使用它来创建SPA history.pushState()

 window.addEventListener( 'hashchange', event => { console.log( `should render page: ${ window.location.hash }` ) }); 

 <a href="#/home">Home</a> <a href="#/page1">Page 1</a> <a href="#/page2">Page 2</a> <a href="#/page3">Page 3</a> 

与history.pushState()相比，这确实还有其他缺点，例如搜索引擎优化等。 但这是进行单页应用程序路由的最简单方法。 因此，某种程度上取决于您要构建的内容。

如果使用的是角钢，则只需使用提供的角钢。