现在已经设置了路由,我们需要一些方法来实际更改路由。
此示例将显示如何使用模板更改路由,但是可以在TypeScript中更改路由。
这是一个示例(无绑定):
<a routerLink="/home">Home</a>
如果用户单击该链接,它将链接到/home。路由器知道如何处理/home,因此它将显示HomeComponent。
这是数据绑定的示例:
<a *ngFor="let link of links" [routerLink]="link">{{link}}</a>
这将需要一个称为links存在的数组,因此将其添加到app.ts:
public links[] = [ 'home', 'login' ]
这将遍历数组,并<a>使用routerLink指令=数组中当前元素的值添加元素,从而创建以下代码:
<a routerLink="home">home</a> <a routerLink="login">login</a>
如果您有很多链接,或者可能需要不断更改链接,这将特别有用。我们通过仅向Angular提供所需的信息,让Angular处理添加链接的繁忙工作。
目前,它links[]是静态的,但有可能从其他来源获取数据。