I'm developing an application using the best of both worlds from Asp.net MVC and AngularJs. I make the bank requisitions with WEBApi which works very well. But now I've added an angular module on the page layout. The page layout ng-app works perfectly, but now the modules of the pages that are inside the render body do not work. Could anyone tell me why the added module in the page layout disrupts the operation of other pages even in non-nested divs. I will not put the code here because it is a commercial application and has a lot of information. but basically the structure is
<html lang="pt-br">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>@ViewBag.Title</title>
<link rel="icon" href="~/favicon.ico"/>
<!--CSS-->
@Styles.Render("~/Content/dashboard")
<!--SCRIPTS-->
@Scripts.Render("~/bundles/modernizr")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/angular")
</head>
<body class="hold-transition skin-blue sidebar-mini">
<div class="wrapper">
<div ng-app="LayoutApp">
<div ng-controller="LayoutCtrl" ng-init="loadInfos()" ng-cloak>
... Menus e SideBars
</div><!--CTRL-->
</div><!--APP-->
<div class="content-wrapper">
<section class="content">
@RenderBody()
</section>
</div>
<footer class="main-footer">
</footer>
<!--SCRIPTS-->
@RenderSection("scripts", required: false)
@Scripts.Render("~/bundles/bootstrap")
@Scripts.Render("~/bundles/dashboard")
@Scripts.Render("~/bundles/modulesLayout")
</body>
</html>
and the structure of renderbody pages
@{
ViewBag.Title = "T";
Layout = "~/Areas/MinhaConta/Views/Shared/_LayoutPage.cshtml";
}
@Scripts.Render("~/bundles/modulesCtrl")
<div ng-app="MyApp">
<div ng-controller="MyCtrl" ng-init="loadInfos()">
</div>
</div>