sábado, 22 de febrero de 2014

Angularjs UI y boostrap 3.0 problema con formulario dentro de Tabs

El siguiente articulo es un tanto técnico, pero quiera publicarlo para que otros pudieran resolver el mismo problema que tuve.

Angularjs es un framework javascript que nos ahorra mucho tiempo en el desarrollo de una aplicación web, para este framework existe una versión de Boostrap con todos los widgets convertidos en directivas.

Ahora bien con el widget Tabs de bootstrap existe cierto problema cuando tienes un formulario dentro de las tabs he intentas acceder al ngFormController dentro de tu controlador. El problema es que en tu controlador no existe el ngFormController de tu formulario por lo tanto no puedes acceder a ninguno de sus metodos.

El problema en si es que la directiva Tab crea un scope aislado y todo elemento dentro de el sera aislado de su padre , por tal razón nunca aparecerá dentro del scope padre. La unica forma de resolver este problema es usando la directiva  "ng-form" de angular para crear nuestro formulario y pasando como modelo un objecto anteriormente definido en el controlador padre, de esta manera cuando la directiva Tab cree su scope heredara del controlador padre.

He creado un ejemplo de como debería de ser resulto este problema :

http://plnkr.co/edit/HKyh1BJYL12knGMfkRq0?p=preview

Mas información en detalle del problema en el siguiente link donde estuve preguntado sobre el problema :

https://github.com/angular-ui/bootstrap/issues/574#issuecomment-34859522




No hay comentarios:

Publicar un comentario