Anuglar quill-editor工具栏颜色设置

对于Angular中使用的quill-editor工具栏颜色设置，你可以通过以下步骤进行：

1. 在你的组件模板中，确保已经正确引入了`quill-editor`组件，并且在该组件上设置了`[(ngModel)]`属性，以便在编辑器中获取和设置内容。

2. 通过在组件中使用`ViewChild`装饰器来获取对quill-editor组件的引用。例如，在组件类中添加以下代码：

import { Component, ViewChild } from '@angular/core';
import { QuillEditorComponent } from 'ngx-quill';

@Component({
  ...
})
export class YourComponent {
  @ViewChild(QuillEditorComponent, { static: true }) editor: QuillEditorComponent;
  
  ...
}

3. 使用`ngAfterViewInit`钩子函数确保在视图初始化后再进行颜色设置。在这个钩子函数中，你可以访问并修改quill-editor的配置对象。

import { AfterViewInit, Component, ViewChild } from '@angular/core';
import { QuillEditorComponent } from 'ngx-quill';

@Component({
  ...
})
export class YourComponent implements AfterViewInit {
  @ViewChild(QuillEditorComponent, { static: true }) editor: QuillEditorComponent;

  ngAfterViewInit() {
    const toolbarOptions = this.editor.quillEditor.options.modules.toolbar;
    // 修改工具栏中的颜色
    toolbarOptions.handlers['color'] = function (value) {
      if (value === 'reset') {
        this.quill.format('color', false);
      } else {
        this.quill.format('color', value);
      }
    };
  }
  
  ...
}

在上面的代码中，我们通过访问`QuillEditorComponent`实例的`quillEditor`属性来获取quill对象，并修改了工具栏中的颜色处理器。

4. 在HTML模板中，确保在`quill-editor`标签上设置了`toolbar`属性，以便显示工具栏。

<quill-editor [(ngModel)]="content" [toolbar]="toolbarOptions"></quill-editor>

在上面的代码中，`toolbarOptions`是你自己定义的工具栏配置。

这样就可以自定义quill-editor工具栏颜色设置了。你可以根据需要进一步修改工具栏的其他属性和样式。