Невозможно прочитать данные ngFor в дочернем компоненте, свойство получения не определено

Question

Я новичок в angular6, у меня есть родительский компонент, в котором у меня есть дочерний компонент, я использую ngFor в родительском компоненте, но не могу использовать свойства в компоненте.

parent.ts: -

this.dummyDataService.getCardInfo().subscribe(
    data => { 
      this.cardInfo = data;
      console.log(this.cardInfo);
    },
    err => console.error(err),
    () => console.log('done loading data')
);

parent. html: -

<card-tile class="grid-item grid-item" *ngFor="let item of cardInfo"></card-tile>

card-tile. html: -

    <li class="label-info" label="Enrolled On">{{item.enrolledOn}}</li>
    <li class="label-info" label="Contact">+91 {{item.contact}}</li>
    <li class="label-info" label="Consent">{{item.consent}}</li>

также пытались с оператором Элвиса: -

{{item?.enrolledOn}}

ошибка в консоли: невозможно прочитать зарегистрированное свойство onon из неопределенного

Пожалуйста, помогите мне.

Answer 1

Вам необходимо установить свойство item вашего класса card-title.ts. Что-то вроде

<card-tile class="grid-item grid-item" *ngFor="let item of cardInfo" [item]="item"></card-tile>

должно работать.