Угловая проверка, если наблюдаемый является нулевым в шаблоне
У меня есть наблюдаемый, определенный в моем угловом компоненте, подобном этому.
profiles$!: Observable<Profile[] | undefined>;`
Я пытаюсь проверить длину этого массива в своем шаблоне следующим образом.
<div *ngIf = "(profiles$ | async).length > 0"></div>
С этой конструкцией я получаю сообщение об ошибке Object is possibly 'null' or 'undefined'. от компилятора машинописного текста, что совершенно нормально. Поэтому добавьте нулевую проверку к моему условию if.
<div *ngIf = "(profiles$ | async) && (profiles$ | async).length > 0"></div>
Я все еще получаю ту же ошибку, что объект может быть нулевым. Я предполагаю, что компилятор не распознает нулевую проверку. Мой вопрос заключается в том, как выполнить нулевую проверку, чтобы избежать ошибки компилятора машинописного текста.
Да, это работает! Спасибо :)
Ответы 1
проблема произойдет, если наблюдаемый вернет ноль
<div *ngIf = "(profiles$ | async).length > 0"></div>
быстрый способ решить эту проблему — использовать оператор безопасной навигации ?
<div *ngIf = "(profiles$ | async)?.length > 0"></div>
или вы можете использовать ng-container с ngIf, если вы хотите применить дополнительную проверку возвращаемого значения наблюдаемого
<ng-container *ngIf = "(profiles$ | async) as result">
<div *ngIf = "result.length > 0"></div>
</ng-container>
Вы можете попробовать просто
(profiles$ | async)?.length > 0. Я предполагаю, что во втором примере компилятор не может знать, что значение должно существовать из-за(profiles$ | async).