Angular2 – erro se não verificar se existe {{object.field}}

Eu tenho uma pergunta sobre como verificar se existe algum campo no object. Eu quero imprimir todas as categorias que o usuário tem, então eu estou fazendo algo parecido com isto:

    0" *ngFor="#category of user.categories">
  • {{category.name}}

O motivo? Todos os dados são impressos corretamente, mas estou recebendo um erro no console da Web como:

 Cannot read property 'name' of null 

Mas quando eu faço algo como:

  
    0" *ngFor="#category of user.categories">
  • {{category.name}}

Então tudo está bem. Estou fazendo algo errado ou talvez eu tenha que verificar isso toda vez? Você já teve um problema como este? Desde já, obrigado.

uso básico

Use o operador de navegação segura

 {{category?.name}} 

então o name só é lido quando a category não é null .

array

Isso só funciona para o . operador (desreferencia). Para um array você pode usar

 {{records && records[0]}} 

Veja também Angular 2 – Não é possível ler a propriedade ‘0’ de erro indefinido com o contexto CONTEXTO DO ERRO: [object Object]

tubo asynchronous

Com o tubo async pode ser usado como

 {{(chapters | async)?.length 

ngModel

Com o ngModel atualmente ele precisa ser dividido em

 [ngModel]="details?.firstname" (ngModelChange)="details.firstname = $event" 

Veja também Dados não estão anexando ao template em angular2

*ngIf

Uma alternativa é sempre envolver a parte da exibição com *ngIf="data" para evitar que a peça seja renderizada antes que os data estejam disponíveis para evitar o erro de desreferenciamento.