"Froala"编辑器移除HTML标签属性

Question

我正在使用“Froala”编辑器来更改内联文本，这是链接：https://froala.com/wysiwyg-editor/docs/options/

除了删除div/p/span等属性外，一切都正常运作。以下是我的函数：

 $('div#eg-custom-toolbar').editable({
      inlineMode: false,
        buttons: ['undo', 'redo' , 'sep', 'bold', 'italic', 'underline']
    })
  });

之前：

  <div contenteditable="true" ng-style="{'color' : styleArr[6]['scopval']}" ng-bind-html="banner_text3" ng-model="banner_text3" ng-mouseleave="hoverOut('banner_text3')" ng-mouseover="hoverIn('banner_text3')" class="banner_text3 ng-pristine ng-untouched ng-valid ng-binding" style="color: rgb(255, 255, 255);">HE #1 CONVERSION EVENT FOR BUSINESS GROWTH</div>

之后:

 <div contenteditable="true" class="banner_text3 ng-pristine ng-untouched ng-valid ng-binding" style="color: rgb(255, 255, 255);">HE #1 CONVERSION EVENT FOR BUSINESS GROWTH</div>

有什么建议吗？

- Rahul

Answer 1

您可以使用 htmlAllowedAttrs 选项指定 AngularJS 属性。

$('.selector').froalaEditor({
  htmlAllowedAttrs: [
                     'title', 'href', 'alt', 'src', 'style', 
                     'ng-style', 'ng-style', 'ng-bind-html', 'ng-mouseleave', 'ng-mouseover'
                    ]
});

- Evgeni Dikerman

Answer 2

我通过将我的电子邮件正文模板中使用的ng属性列表添加到Froala编辑器允许属性列表中来解决了这个问题。

$.FroalaEditor.DEFAULTS.htmlAllowedAttrs = $.merge($.FroalaEditor.DEFAULTS.htmlAllowedAttrs, ["ng-if", "ng-repeat", "ng-show"]);

请注意，您不必再次复制整个列表，您可以使用合并函数来完成相同的操作。

- Rady