如何讓 froala 編輯器允許所有內聯 html 標簽？

Question

我正在使用“froala”編輯器將電子郵件模板添加到數據庫，但“froala”編輯器總是刪除一些這樣的 html 標簽

<div [removed]="table-layout:fixed; width: 100%;" class="mailwrapper">
<br>

<table [removed]="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-smooth: always; -webkit-font-smoothing: antialiased; height: 16px; -premailer-height: 16;" align="center" cellpadding="0" cellspacing="0" class="mainTable">

這是我的代碼

    $(function () {
    $('#editor').froalaEditor({
        inlineMode: false,
        //toolbarInline: true,
        charCounterCount: true,
        toolbarButtons: ['fontFamily', 'fontSize', 'color', 'paragraphFormat', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', '|', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '-', 'insertImage', 'insertLink', 'emoticons', 'insertVideo', 'insertTable', 'undo', 'redo', 'fullscreen', 'html'],
        toolbarVisibleWithoutSelection: true,
        heightMin: 500,
        height: 500,
        htmlAllowedTags: ['.*'],
        htmlAllowedAttrs: ['.*'],
        allowedContent : true
    });
});

Answer 1

閱讀了 Froala 的壓縮/漂亮印刷版本后，我懷疑通配符在這種情況下是否有效。

Froala 選項塊不是實現您想要的東西的好工具，因為您在那里允許的標簽和屬性替換了默認的允許標簽列表，而不是擴展它。

我選擇做的是在代碼中修改編輯器的 allowedHtmlTags 數組，在我的插件的 _init 代碼中。 您不需要為此使用插件，也可以在編輯器的引導序列期間將代碼應用到事件偵聽器中。

    public _init() {
// ... misc init code
        const opts: any = this._editor.opts;
// just routine safety
        if (opts.htmlAllowedTags && opts.htmlAllowedTags.push) {
            opts.htmlAllowedTags.push("myTag");
        }
    }