renderizar escape angularjs google-chrome wysiwyg text-editor redactor.js

angularjs - escape - ng-if



Redactor edita problemas de formato de texto con Chrome versiĆ³n 58 (3)

Estamos utilizando Redactor ( https://imperavi.com/redactor/ ) versión 10.1.1 y no hemos migrado a Redactor II debido a la gran cantidad de dependencias en el proyecto.

Recientemente enfrentamos un problema muy extraño con Chrome versión 58. Los problemas son:

- No se puede formatear en negrita, cursiva, subrayado, sup, sub, etc. para el texto seleccionado

Por favor, háganos saber si hay alguna solución para esto. Cualquier tipo de ayuda sería muy apreciada.

Actualización según solución de trabajo aceptada:

// Provided solution is tested for Redactor version 10.1.1 createMarkers: function() { this.selection.get(); var node1 = this.selection.getMarker(1); this.selection.setMarker(this.range, node1, true); if (this.range.collapsed === false) { var node2 = this.selection.getMarker(2); this.selection.setMarker(this.range, node2, false); // Fix for Chrome58 Issues if (this.utils.browser(''chrome'')) { this.caret.set(node1, 0, node2, 0); } // End Chrome58 Issues } this.savedSel = this.$editor.html(); },


Creo que puedo haber encontrado la solución: parece que Chrome 58 (a veces) restablece la selección cuando llamamos Range.insertNode .

La solución que sugiero es restaurar la selección cuando el Redactor agrega los marcadores de selección: en la función createMarkers , justo después de configurar el marcador node2 , puede agregar esta llamada de función: this.caret.set(node1, 0, node2, 0);

Here''s la solución que debería arreglar Redactor para concrete5 (pero también debería funcionar para otros proyectos).


El código original es así tanto en 10.2.2 como en 10.2.5.

getNodes: function() { this.selection.get(); var startNode = this.selection.getNodesMarker(1); var endNode = this.selection.getNodesMarker(2); if (this.range.collapsed === false) { if (window.getSelection) { var sel = window.getSelection(); if (sel.rangeCount > 0) { var range = sel.getRangeAt(0); var startPointNode = range.startContainer, startOffset = range.startOffset; var boundaryRange = range.cloneRange(); boundaryRange.collapse(false); boundaryRange.insertNode(endNode); boundaryRange.setStart(startPointNode, startOffset); boundaryRange.collapse(true); boundaryRange.insertNode(startNode); // Reselect the original text range.setStartAfter(startNode); range.setEndBefore(endNode); sel.removeAllRanges(); sel.addRange(range); } } } else { this.selection.setNodesMarker(this.range, startNode, true); endNode = startNode; } how to change it?


en lugar de esto en la versión 10.2.5

En general, puedes hacer eso: reescribir la función setMarker:

setMarker: function (range, node, type) { var nclone = window.getSelection().getRangeAt(0).cloneRange(); range = range.cloneRange(); try { var selection = window.getSelection(); range.collapse(type); range.insertNode(node); selection.removeAllRanges(); selection.addRange(nclone); } catch (e) { this.focus.setStart(); } },

o agregue un arreglo en la función createMarkers: // La solución proporcionada se prueba para la versión 10.1.1 de Redactor

createMarkers: function() { this.selection.get(); var node1 = this.selection.getMarker(1); this.selection.setMarker(this.range, node1, true); if (this.range.collapsed === false) { var node2 = this.selection.getMarker(2); this.selection.setMarker(this.range, node2, false); // Fix for Chrome58 Issues if (this.utils.browser(''chrome'')) { this.caret.set(node1, 0, node2, 0); } // End Chrome58 Issues } this.savedSel = this.$editor.html(); },

Esto está funcionando y probado en Chrome 60.