CODEWITHSUNDEEP
htmlangular
Brio Tech
Brio Tech

Reputation: 85

VS code parse error ignored in some components

Currently working on an html template using angular, and I have this code:

 <a mat-list-item class="side-link" [routerLinkActive]="['is-active']" [routerLink]="[{outlets: { agent-sidebar: ['agent-manage-clients'] } }]"><i class="fas fa-user mr-3"></i>Clients</a>

As you can see, there's nothing wrong with the code. However, doing an ng build produces an error whereas the compiler is looking for a missing : token where I think is unnecessary.

  1. Why does my compiler keep looking for a 'missing' token even though I have closed the braces correctly?
  2. This is funny to me because this is a copy pasted working code in a different component and only produced an error when I pasted it in this new component. So why isn't it producing the same error in the other component?

Upvotes: 0

Views: 157

Answers (1)

Brio Tech
Brio Tech

Reputation: 85

So apparently, I've fixed this bug of mine by changing the name of my router-outlet. It turns out that naming my outlet agent-sidebar with the token - messes up the compiler somehow. So after almost half a day of work, I've changed this:

[routerLink]="[{outlets: { agent-sidebar: ['agent-manage-clients'] } }]"

to this:

[routerLink]="[{outlets: { agentSidebar: ['agent-manage-clients'] } }]"

and compiler is now working properly.

Upvotes: 1

Related Questions