When would you surround routerLink in square brackets?

If you want a more in-depth answer...

RouterLink is a Directive which uses the selector routerLink and has a Property called "routerLink". Because the property and the selector have the same name, you only need to add brackets to the selector to bind to that property.

The [routerLink] Property accepts an array of path segments, followed by the params for each segment. You can use variables inside that array to create your link.

If your link won't change, then you don't need the brackets and can just assign your link to the selector using a string.

I found this in the docs: https://angular.io/api/router/RouterLink

When you put square brackets around routerLink (or any Angular binding) it will evaluate what you pass to it as a JavaScript expression. If you don't put square brackets around routerLink it will take what you pass it as a literal string.

So if you want to pass an array to routerLink or evaluate a variable then you would have to use square brackets. If you want to pass a string you could either do

<a routerLink="/path">

OR

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