Angular JS - Trabajando con multiples APP (module) en una misma página

 Cuando tenemos dos o más Modules sólo funcionará el primero, para solucionar esto tan solo hay que llamar a cada uno de los aspx en un div y llamar a la función de angular.bootstrap para cada uno de los module.

 //al principio de la página
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/usuarios/UsuariosModule.js")"></script>
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/usuarios/UsuariosService.js")"></script>
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/usuarios/UsuariosController.js")"></script>
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/empresas/EmpresasModule.js")"></script>
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/empresas/EmpresasService.js")"></script>
<script src="@VirtualPathUtility.ToAbsolute("~/Scripts/empresas/EmpresasController.js")"></script>

 <div id="divAltaEmpresa">@{Html.RenderPartial("AltaEmpresa");}</div>
 <div id="divAltaUsuario">@{Html.RenderPartial("AltaUsuario");}</div>

//al final de la página
<script type="text/javascript">
    var dvFirst = document.getElementById('divAltaEmpresa');
    var dvSecond = document.getElementById('divAltaUsuario');

    angular.element(document).ready(function () {
        angular.bootstrap(dvFirst, ['EmpresasModule']);
        angular.bootstrap(dvSecond, ['UsuariosModule']);
    });
</script>

Comentarios

Entradas populares