I am faced with a scenario where two services (A and B) need to communicate with each other. Service A is required to build a chart based on asynchronous data received from service B, which is used in other areas so it operates independently. I attempted to transfer the functionality from the component A to its service, but I have encountered difficulties in accessing the template of the component:
@Injectable()
export class HistoricGraphService {
... // implementation details
onNewData() {
const canvas = <HTMLCanvasElement>document.getElementById('historic-chart');
const ctx = canvas.getContext('2d');
... logic to construct the chart using data, timestamp, and more
}
}
The issue does not lie with the data itself, as the chart is generated successfully when this method is utilized in Component A. I am simply seeking to understand why the same approach cannot be applied to retrieve an element from my template.