我们在angular4应用程序中使用froala编辑器,并且在尝试验证编辑器内容时遇到困难。基本上我们想要禁止只是在编辑器中键入空格,制表符或输入字符的用户。
我尝试了以下代码但没有成功:
options: Object = {
placeholderText: '',
height: 300,
charCounterMax: 3000,
htmlAllowedEmptyTags: [],
events : {
'froalaEditor.blur' : function(e, editor) {
editor.html.unwrap();
editor.html.cleanEmptyTags();
console.log("'" + editor.html.get() + "'");
}
}
}
无论我做什么,我还是
'<p> </p>'
当用户输入空格键两次并验证时。 是否有任何修剪功能或类似的东西? 非常感谢
答案 0 :(得分:0)
您可以利用innerText
属性并自行修剪内容。
const buttonConfig = ['bold', 'italic', 'underline', '|', 'formatOL', 'formatUL', '|', 'insertLink', '|', 'undo', 'redo'];
this.options = {
charCounterCount: true,
key: environment.froalaLicenseKey,
language: 'de',
charCounterMax: this.maxLength,
toolbarButtons: buttonConfig,
toolbarButtonsSM: buttonConfig,
toolbarButtonsXS: buttonConfig,
placeholderText: this.placeholder,
pluginsEnabled: ['link', 'lists', 'charCounter'],
linkAlwaysBlank: true,
linkInsertButtons: ['linkBack'],
linkEditButtons: ['linkOpen', 'linkEdit', 'linkRemove'],
zIndex: 9999,
events: {
/*on every blur event check if the user has actually inserted content and clean if needed*/
'froalaEditor.blur': (e: FocusEvent, editor) => (editor) => {
let t = document.createElement('div');
t.innerHTML = editor.html.get();
let trimmedText = t.innerText.trim();
if (!trimmedText) {
editor.html.set('');
editor.events.trigger('charCounter.update');
}
},
},
};