ngx-editor with font-awesome 5+

Question

使用最新版font-awesome 5.3时，工具栏上的部分按钮图标无效

在 ngx-editor 支持 5.3 之前，有人有好的解决方法吗？

"image"-button: fa-picture-o 已替换为 fa-image
"unlink"-button: fa-chain-broken 已替换为 fa-unlink

...希望有人在他们的项目中解决了这个问题！ :)

谢谢！

Answer 1

我阅读了文档，但找不到更改图标的方法

目前我的解决方案是替换 ngAfterViewChecked 中的 (style)类生命周期挂钩。

如果您不使用 ngAfterViewChecked 生命周期挂钩，您将在它们存在之前替换类。（例如，他们不会被发现，因为编辑器不在 DOM 中）

我希望这个（临时且丑陋的）解决方案暂时有效。

ngAfterViewChecked() {
    this.replaceFontAwesomeIcons('fa-scissors',  'fa-cut');
    this.replaceFontAwesomeIcons('fa-files-o',  'fa-copy');
    this.replaceFontAwesomeIcons('fa-repeat',  'fa-redo');
    this.replaceFontAwesomeIcons('fa-picture-o',  'fa-image');
  }

private replaceFontAwesomeIcons(currentClassName: string, newClassName: string) {
    const icons = document.getElementsByClassName(currentClassName);
    for (let i = 0; i < icons.length; i++) {
      icons.item(i).classList.add(newClassName);
      icons.item(i).classList.remove(currentClassName);
    }
  }

ngx-editor with font-awesome 5+

ngx-editor with font-awesome 5+

angular

font-awesome-5

ngx-editor