angular 通过document.getElementById(‘c1’);获取html元素报错，具体如下：

  1. core.js:4352 ERROR TypeError: Cannot read property 'appendChild' of null
  2.     at new Chart (chart.js:19)
  3.     at Line.push.zJSt.Plot.createG2 (plot.js:27)
  4.     at Line.Plot [as constructor] (plot.js:18)
  5.     at new Line (index.js:9)
  6.     at DisplayboardComponent.chartData (displayboard.component.ts:48)
  7.     at DisplayboardComponent.ngOnInit (displayboard.component.ts:25)
  8.     at callHook (core.js:3105)
  9.     at callHooks (core.js:3075)
  10.     at executeInitAndCheckHooks (core.js:3027)
  11.     at refreshView (core.js:7333)

百度了一下原因是你获取的节点不存在引起的。分析发下我这个是动态加载组件，可能加载完后，页面上还没有该组件的html元素，于是获取不到，最后找到angular的一个ElementRef来获取元素，具体如下：
//原先获取方式
const c1 = document.getElementById(‘c1’);
//修改后获取方式
const c2 = this.elRef.nativeElement.querySelector(‘#c1’);

  1. import { Component, ElementRef, OnInit } from '@angular/core';
  3. @Component({
  4.   selector: 'app-XXX',
  5.   templateUrl: './XXX.component.html',
  6.   styleUrls: ['./XXX.component.scss']
  7. })
  8. export class XXXComponent implements OnInit {
  9.   constructor(private elRef : ElementRef) { }
  10.   ngOnInit(): void {
  11.      //原先获取方式
  12.     const c1 = document.getElementById('c1');
  13.     //修改后获取方式
  14.     const c2 = this.elRef.nativeElement.querySelector('#c1');
  15.     }