Я получаю данные от Rest API, используя http-клиент.Сейчас я пытаюсь разделить эти данные между двумя компонентами (возможно, позже), используя оформление @input.
parent.component.html
<app-child [signalements]="signalements"></app-child>
parent.component.ts
@Component({
selector: 'app-parent',
templateUrl: './parent.component.html',
styleUrls: ['./parent.component.css']
})
export class ParentComponent implements OnInit {
signalements: Signalement[];
constructor(private signalementService: SignalementService) { }
ngOnInit() {
this.getSignalements();
}
getSignalements(): void {
this.signalementService.getSignalements().subscribe(signalements => this.signalements = signalements);
}
child.component.ts
export class ChildComponent implements OnInit, AfterViewInit {
displayedColumns = ['idsignalement', 'nom', 'description', 'descriptionlieu', 'date', 'x', 'y'];
signalementsDataSource = new MatTableDataSource<Signalement>();
@Input() signalements: Signalement[];
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
constructor() { }
ngOnInit(): void {
this.signalementsDataSource.data = this.signalements;
}
ngAfterViewInit() {
console.log(this.signalements);
this.signalementsDataSource.paginator = this.paginator;
this.signalementsDataSource.sort = this.sort;
}
сигнализации: не определено
Проблема: данные не разделяются между двумя компонентами, я думаю, этопотому что переменная signalements не инициализируется во времени?
Пожалуйста, объясните, как правильно обмениваться данными, запрашиваемыми у API.В каком компоненте мы должны называть http сервис?