Question

无法在 Angular 4 中读取 null 的属性“outlets”

2017-08-28

16240

angular angular-router

我有一个 Angular 4.3.6 项目，其中模板代码片段产生了此错误。

模板块：

<a [routerLink]="['/article',article?.id]">{{article?.title}}</a>

错误堆栈跟踪：

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 (

错误原因似乎很明显。article 变量是从 Http 异步获取的，并在页面呈现后初始化，因此首先它为空。但是我认为在这个变量后面放 ? 可以避免这个问题。

你能给出建议吗？

Answer 1

article?.id 中的 ? 工作正常，但 RouterLink 指令不喜欢传递 null 。

您可以使用类似以下方法解决：

<a *ngIf="article" [routerLink]="['/article',article?.id]">{{article?.title}}</a>
<a *ngIf="!article">{{article?.title}}</a>

Answer 2

 <a  [routerLink]="['/language',language.iso639_1 || 'all']" >{{language.name}}</a>

我也遇到了同样的问题（无法读取 null 的属性“outlets”），但我编写的上述代码对我有用。