Initialising quill as part of an Angular component

问题

I want to set up an Angular component with a Quill element in it as follows (I do not want to use ngx-qull as I have a requirement to customise the component further): https://plnkr.co/edit/FWnHxo7eQpVtrzRN?open=lib%2Fscript.js&preview (wherein, I can assign a custom toolbar to a single Quill element as per https://github.com/quilljs/quill/issues/633#issuecomment-307709326)

Angular component

import * as Quill from 'quill';

constructor(
  private elementRef: ElementRef
) {
}

export class TestComponent implements OnInit, {
  ngOnInit() {
     this.componentId = this.elementRef.nativeElement['id'];
     const quill = new Quill(`#editor-${this.componentId}`, {});
     console.log(quill);
  }
}

HTML

<div id="editor-{{  componentId }}">
  <p>Hello World!</p>
  <p>Some initial <strong>bold</strong> text</p>
  <p><br></p>
</div>

However I keep getting the following error:

quill Invalid Quill container #editor-features-L7Q6yY1n

How do I fix this?

来源：https://stackoverflow.com/questions/61667844/initialising-quill-as-part-of-an-angular-component