CODEWITHSUNDEEP
javascriptangularjsfroala
Rahul
Rahul

Reputation: 450

"froala" Editor Removing html tag attributes

I am using "froala" Editor for changing inline text,here is the link

Every thing is working fine except it removing the div/p/span etc attributes. here is my function

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

before:

  <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>

After:

 <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>

Any suggestions?

Upvotes: 3

Views: 4233

Answers (2)

Rady
Rady

Reputation: 918

I fixed it by adding the list of ng attributes used in my email body templates to the list of allowed attributes in Froala editor.

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

Note that you don't have to copy & paste the whole list again, you can use merge function to do the same.

Upvotes: 1

Evgeni Dikerman
Evgeni Dikerman

Reputation: 516

You can specify angularJS attributes with the htmlAllowedAttrs option.

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

Upvotes: 3

Related Questions