Angular 4 - связывайте значения из api с компонентом и шаблоном
В приложении Angular 4 у меня есть таблица со строками. Мне нужно интегрировать каждую строку с компонентом представления списка, чтобы он правильно отображался на веб-странице. Компонент представления списка показывает статус как успех - зеленый цвет, предупреждение - красный цвет, информация - синий цвет.
<list-view [status] = "success"></list-view>
это возвращает вид списка с зеленым цветом.
но API возвращает значение как Черновик, Не изменено, Ошибка. Я не понимаю, как сопоставить значения api со значением, которое понимает шаблон.
где данные = "Data":[ {id:1, status:"draft"}, {id:2,status:"Not Changed"},{id:3,status:"Error"} ]
html -
<ng-container *ngFor = "let data of Data">
<tr style = "margin-top: 8px !important;">
<list-view [status] = "{{data.status}}"></adp-list-view>
здесь статус возвращается как Черновик, но я успешно изменил его в компоненте, поэтому мой шаблон работает с ожидаемым результатом.
@ExplosionPills я хранил в {{}}, потому что я получаю значение статуса из API, но да, без него тоже все в порядке.
Нет, этот синтаксис вызовет ошибку синтаксического анализа шаблона. Вы не можете использовать привязку атрибута [] и синтаксис интерполяции {{ }} в одном и том же операторе.
вы можете опубликовать, как вы получаете данные? Вы разворачиваете асинхронный вызов свойства компонента Data?
Я не уверен, что понимаю ваш вопрос / проблему. Это должен быть
[status] = "data.status", поскольку[]уже выполняет привязку входных свойств.