服務是否可以訪問組件的模板

我有兩個服務（A和B）在彼此之間進行通信，A必須在另一個服務接收到異步數據時創建圖表（這些數據在其他地方使用，因此B是獨立的）。我試圖轉移我做什麼與組分A到它的服務，但它看起來像我不能讓訪問組件的模板：服務是否可以訪問組件的模板

@Injectable() 
export class HistoricGraphService { 

... // doing stuff 

    onNewData() { 
    const canvas = <HTMLCanvasElement>document.getElementById('historic-chart'); 
    const ctx = canvas.getContext('2d'); 
    ... building the chart based on datas, timestamp and much more 
    } 
}

問題心不是周圍的DATAS，製作圖表時工作這個方法在組件A中使用，我想知道爲什麼我不能使用相同的過程從我的模板中獲取元素。

來源

2017-09-01 Quentin Laillé

不是本身，而是可以注入組件和組件的服務可以傳遞給服務，但這不應該是必需的。訪問模板應該由組件完成。只需從服務向組件發送關於應該執行的操作的命令 –

我認爲你需要做以下修改：

您的服務應該只負責獲取數據，並將其返回到您的組件
在你的組件，你不應該直接參考文件。如果確實需要引用的元素，你可能想去做這件事，像這樣：

在HTML：

<canvas #historicChart></canvas>

在Component：

@ViewChild('historicChart') historicChart: ElementRef;

然後，在獲取組件中的數據後：

const ctx = (this.historicChart.nativeElement as HTMLCanvasElement).getContext('2d')

來源

2017-09-01 14:49:15 John

通過遵循您的解決方案，問題是何時可以在服務的數據可用時調用組件的方法構建圖表？我可以使用事件發射器或@輸入/ @輸出嗎？ –

您可以將EventEmitter放入服務將數據推送到的其中一個服務中;你的組件可以訂閱 – John

服務是否可以訪問組件的模板

回答

相關問題