AngularJS - ng-bind no funciona en textarea con plugin

[Kluster]

Hola, colegas.

Tengo un textarea de un formulario que quiero enlazar con una variable de mi scope en angular.

La directiva ng-bind funciona bien con el textarea puro, pero cuando lo uso como un editor wysiwyg utilizando algún plugin jquery, deja de funcionar, me muestra el textarea vacío. Me pasa con summernote y con tinyEditor, no he probado otros editores.

¿Alguna sugerencia?

[eContento]

Yo creo que todos esos editores funcionan creando un contenedor paralelo y mostrando el editor y ocultando el textarea. Si el ng-bind está puesto al textarea, y éste se destruye o reemplaza por el nuevo editor en tiempo de ejecución, se perderá el bindeo.

Huele a que por ahí viene el problema. Casi todos los editores despachan un evento cuando se han cargado, ¿no puedes aprovechar ese momento para realizar el bindeo programaticamente en lugar de hacerlo por directivas de angular en el textarea? Si no tendrás que hacerlo a la vieja usanza, controlando los eventos del editor y persistiendo los cambios en el modelo.

O usando un editor que sea un componente de angular:

Buscando, he encontrado un par de ejemplos rápidos:

- http://codepen.io/paulbhartzog/pen/Hpsjg
- https://github.com/angular-ui/ui-tinymce

[elank0]

Una solución es crear una directiva que compile el código HTML dónde pones el textarea con el WYSIWYG.

De este modo y mediante:

Código Javascript:

$compile(html)(scope);
 

El código de angular reconocerá el HTML dónde está tu plugin JS.

Saludos

[Kluster]

Al final utilicé angular-wysiwyg, y funciona bien sin muchos quebraderos de cabeza, ni tener que manipular el DOM, y con la misma directiva ng-model. Gracias.