Получить значение из объекта json в html
Как я могу показать только значение 100 в div ниже?
<div> {{uploadProgress | async | json}} </div>
Текущее отображаемое значение:
[ { "filename": "Mailman-Linux.jpg", "progress": 100 } ]
Ниже моего интерфейса из файла .ts:
interface IUploadProgress {
filename: string;
progress: number;
}
нет, когда я это делаю, ничего не отображается, также прогресс недоступен для uploadProgress в intellisense в машинописном тексте
Ответы 1
Этот uploadProgress | async получает объекты потока.
После AsyncPipe он, вероятно, распечатает [Object object]
Поскольку теперь это объект, вы можете просто получить атрибут прогресса, как и любой другой объект.
Результат должен выглядеть так:
<div> {{(uploadProgress | async).progress}} </div>
Кроме того, если наблюдаемое у вас не является BehaviourSubject, вы можете добавить безопасная навигация с ? после Asyncpipe, чтобы предотвратить ошибки undefined:
<div> {{(uploadProgress | async)?.progress}} </div>
Как правильно упоминает ShamPooSham, похоже, что результатом является массив. Поэтому ответ должен выглядеть так:
<div> {{(uploadProgress | async)[0]?.progress}} </div>
Кажется, что результатом является массив, поэтому, если OP просто хочет первое значение, вы должны добавить 0-индекс
извините, но {{(uploadProgress | async) .progress} с или без? все еще ничего не показывает
теперь возвращает эту ошибку: Ошибка синтаксического анализатора: условное выражение (uploadProgress | async)? [0] .progress требует наличия всех трех выражений в конце выражения [{{(uploadProgress | async)? [0] .progress}}]
DarkW1nter хорошо, мой плохой? должен быть после индекса
А как насчет
<div> {{uploadProgress.progress}} </div>?