使用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()函数（{{3 }}。

每个SPA框架都一样。

Answer 2

window.location.hash是可以更改而无需重新加载的。如果您不想弄乱history.pushState()

，也可以使用它来创建SPA。

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()相比，这确实还有其他缺点，例如搜索引擎优化等。但这是进行单页应用程序路由的最简单方法。因此，是否满足就取决于您要构建的内容。

但是，如果您使用的是角钢，则只需使用路由角钢提供。