Angular: Когда украшения @input обмениваются данными? - PullRequest
0 голосов
/ 05 марта 2019

Я получаю данные от 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 сервис?

...