score:0

Accepted answer

My guess is you shouldn't use @ViewChild at all. @ViewChild property decorator makes possible to look for element or the directive matching the selector in the view DOM, but your code looks like there is no barchart directive or selector in html. So this.barchart is always undefined. Though, you have a class barchart that can be used. You should create an instance of barchart and call bar:

// home.component.ts
// import your barchar class
import { barchart } from './pathtobarchart';

_barchart: barchart;

constructor(private service : ServiceService) {
  // create an instance of barchart class,
  // so you can use it inside the methods of
  // your HomeComponent
  this._barchart = new barchart();
}

drop(event :CdkDragDrop<string[]>) {
  if (event.previousContainer === event.container) {
    moveItemInArray(event.container.data, event.previousIndex, 
    event.currentIndex);
  } else {
   transferArrayItem(event.previousContainer.data, event.container.data , event.previousIndex, event.currentIndex);  
   this._barchart.bar(event.container.data,event.container.id);
  }  
}

score:0

Problem:

drop(event :CdkDragDrop<string[]>){ 
  if (event.previousContainer === event.container) {
    moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
  } else {
    console.log("different container");
    transferArrayItem(event.previousContainer.data, event.container.data , event.previousIndex, event.currentIndex);  
    console.log(event.container.id);
    console.log(event.container)
    this.barChart.bar(event.container.data,event.container.id); <-- problem
  }  
}

fix:

drop(event :CdkDragDrop<string[]>){ 
  if (event.previousContainer === event.container) {
    moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
  } else {
    console.log("different container");
    transferArrayItem(event.previousContainer.data, event.container.data , event.previousIndex, event.currentIndex);  
    console.log(event.container.id);
    console.log(event.container)
    barChart.bar(event.container.data,event.container.id); <-- fix
  }  
}

Related Query