Tengo una pregunta sobre cómo verificar si existe algún campo en el objeto.
Quiero imprimir todas las categorías que tiene el usuario, así que estoy haciendo algo como esto:
<ul *ngIf="user.categories.length > 0" *ngFor="#category of user.categories"> <li> {{category.name}} </li> </ul>¿La razón? Todos los datos están impresos CORRECTAMENTE , pero recibo un error en la consola web como este:
Cannot read property 'name' of nullPero cuando hago algo como:
<ul *ngIf="user.categories.length > 0" *ngFor="#category of user.categories"> <li *ngIf="category"> {{category.name}} </li> </ul>Entonces todo está bien.
¿Estoy haciendo algo mal o tal vez tengo que verificar esto cada vez? ¿Alguna vez has tenido un problema como este?
uso básico
Usar el operador de navegación segura
{{category?.name}} entonces el name solo se lee cuando category no es null .
formación
Esto solo funciona para el . (desreferenciar) operador. Para una matriz puedes usar
{{records && records[0]}}Consulte también Angular 2: no se puede leer la propiedad '0' de un error indefinido con contexto CONTEXTO DE ERROR: [objeto Objeto]
tubería asíncrona
Con tubería async se puede usar como
{{(chapters | async)?.length ngModel
Con ngModel actualmente, debe dividirse en
[ngModel]="details?.firstname" (ngModelChange)="details.firstname = $event"Consulte también Los datos no se agregan a la plantilla en angular2
*ngIf
Una alternativa siempre es envolver la parte de la vista con *ngIf="data" para evitar que la parte se represente antes de que los data estén disponibles para evitar el error de desreferencia.