AngularJS cómo enlazar datos con el widget SVG
Sé que esta no suele ser la forma de utilizar AngularJS, pero me preguntaba si lo que quiero lograr es factible con AngularJS. Si esta no es la forma recomendada, ¿podría darnos consejos sobre cómo lograrlo? Por favor considera que soy nuevo en el área de programación web.
Así que en mi proyecto dibujé usando varios widgets de SVG & RaphaelJS en un lienzo que se coloca dentro del div "titular". Estoy tratando de vincular estos widgets a los datos usando AngularJS, básicamente cada widget está vinculado a un objeto en el CustomController. ¿Cómo puedo acceder al CustomController cuando inicializo mis widgets?
<html lang="en" style="height: 100%;" ng-app="myApp">
<head>
<script type="text/javascript"">
$(document).ready(function () {
var canvas = Raphael('holder', '800', '600');
var widget1 = new Widget1(params);
// initialize widgets here, that I need to bind to data using AngularJS
// I am not able to access the CustomController here when drawing my widgets
});
</script>
</head>
<body>
<div id="holder" ng-controller="CustomController">
</div>
</body>
</html>
¿Es esto de todos modos para lograr el enlace de datos en widgets SVG utilizando AngularJS? Estoy empezando a pensar que este no es el propósito de AngularJS ... en este caso, ¿podría por favor aconsejarme sobre cómo hacer esto?
ACTUALIZAR:
Chicos muchas gracias por tus respuestas! El requisito es que el widget acepte la entrada del usuario y quiero que no se coloque en el archivo html (para propósitos de modularidad). Así que la directiva parece ser la principal opción por ahora. En el método de enlace dibujaría el widget utilizando RaphaelJS y también puedo dibujar los objetos editables, pero de esta manera no utilizaría correctamente el mecanismo de enlace de AngularJS, serían solo relojes y controladores de eventos ... lo que me parece complicado. Hubiera sido bueno si de alguna manera hubiera podido poner etiquetas SVG en la propiedad de la plantilla de la directiva y hacer el enlace en la plantilla, pero eso no parece ser compatible.
¿Tienen otras ideas sobre esto?
Por cierto, ¿hay alguna manera de aplicar enlaces programáticamente entre una propiedad y un elemento HTML (por ejemplo, un cuadro de texto) obtenido con jQuery?
Saludos