Question

Angular 2 cheat sheet显示模板中带有和不带方括号的routerLink示例：

<a routerLink="/path">
<a [routerLink]="[ '/path', routeParam ]">
<a [routerLink]="[ '/path', { matrixParam: 'value' } ]">
<a [routerLink]="[ '/path' ]" [queryParams]="{ page: 1 }">
<a [routerLink]="[ '/path' ]" fragment="anchor">

功能有何不同？

Answer 1

当您在routerLink（或任何Angular绑定）周围放置方括号时，它将评估您作为JavaScript表达式传递给它的内容。如果你不在routerLink左右放置方括号，那么你将把它作为文字字符串传递给你。

因此，如果您想将数组传递给routerLink或评估变量，那么您必须使用方括号。如果你想传递一个字符串，你可以做

<a routerLink="/path">

OR

<a [routerLink]="'/path'">

Answer 2

对于像我这样的菜鸟，他们需要更深入的答案...

RouterLink是一个使用选择器routerLink的指令，并且具有一个称为“ routerLink”的属性。由于属性和选择器具有相同的名称，因此您只需在选择器上添加方括号即可绑定到该属性。

[routerLink]属性接受路径段数组，然后是每个段的参数。您可以在该数组中使用变量来创建链接。

如果您的链接不会更改，则不需要括号，只需使用字符串将链接分配给选择器即可。

我在文档https://angular.io/api/router/RouterLink

中找到了这个

你什么时候在方括号内环绕routerLink？

2 个答案: