Как обновлять данные в графике в реальном времени?

Как сделать обновление данных на графике при добавлении, удалении или изменении информации? Изменения отображаемой информации на графике должны происходить в режиме реального времени. И желательно без использовании дочернего компонента.

ngOnInit() {
    this.loadReport()
  }

  private loadReport() {
    this.reportService.fetch(this.report_id).subscribe((data: Report[]) => {
      this.reports = data
    })
  }


  ngAfterViewInit() {
    const incomeConfig: any = {
      label: 'Income',
      backgroundColor: '#009688',
      borderColor: '#00796b'
    }

    const consumptionConfig: any = {
      label: 'Consumption',
      backgroundColor: '#0d47a1',
      borderColor: '#2196f3'
    }

    const dateConfig: any = {
      datasets: [ incomeConfig, consumptionConfig]
    }

    this.reportService.fetch(this.report_id).subscribe((data: Report[]) => {
      incomeConfig.data = data.map(item => item.income)
      consumptionConfig.data = data.map(item => item.consumption)
      dateConfig.labels = data.map(item => item.date)
      const reportCtx = this.reportRef.nativeElement.getContext('2d')

      new Chart(reportCtx, {
        type: 'bar',
        data: dateConfig,
        options: {
          scales: {
            xAxes: [{
                gridLines: {
                    offsetGridLines: true
                }
            }]
          } 
        }
      })
    })
  }