I have Angular 4.3.6 project where a template snippet produces this error.
Template block:
<a [routerLink]="['/article',article?.id]">{{article?.title}}</a>
Error stack trace:
ArticleSpComponent.html:26 ERROR TypeError: Cannot read property 'outlets' of null at createNewSegmentGroup (router.es5.js:2967) at updateSegmentGroup (router.es5.js:2896) at router.es5.js:2914 at forEach (router.es5.js:593) at updateSegmentGroupChildren (
The error cause seems to be obvious. article variable is fetched async from Http and initialized after page is rendered so firstly it's null. However I thought that putting ? after this variable allows to avoid this issue.
Can you please advise?
?
in article?.id
is working fine, but the RouterLink
directive doesn't like getting a null
passed.
You could work around using something like:
<a *ngIf="article" [routerLink]="['/article',article?.id]">{{article?.title}}</a> <a *ngIf="!article">{{article?.title}}</a>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With