问在同一页面mvc视图中多次使用相同的ng-app和ng-controller
EN

Stack Overflow用户

提问于 2016-07-05 21:09:48

回答 1查看 585关注 0票数 3

我需要在相同的mvc视图页面中多次使用相同的ng-app和相同的ng-controller。

<div ng-app="rootapp" ng-controller="rootcontroller">
<div id="div1">
---first content--------
    <div ng-app="editorApp" ng-controller="editorController" ng-init="getInformation('SettingsDuplicates')">

                    <div class="col-sm-2 validation-right" style="width:12.666667%">
                        <div class="greySlideB">
                            @Html.Partial("~/Views/Shared/Information/_InformationPartial.cshtml")

                            @Html.Partial("~/Views/Shared/RecentNotes/_RecentNotesPartial.cshtml")
                        </div>
                    </div>
                </div>
</div>

<div id="div2">
.......second content-------
    <div ng-app="editorApp" ng-controller="editorController" ng-init="getInformation('SettingsDuplicates')">

                    <div class="col-sm-2 validation-right" style="width:12.666667%">
                        <div class="greySlideB">
                            @Html.Partial("~/Views/Shared/Information/_InformationPartial.cshtml")

                            @Html.Partial("~/Views/Shared/RecentNotes/_RecentNotesPartial.cshtml")
                        </div>
                    </div>
                </div>
</div>


</div>

因为ng-init函数调用参数对于每个div是不同的。在另一个ng-app中多次使用相同的ng-app和ng-controller的最佳方式是什么？

javascript

jquery

angularjs

回答 1

Stack Overflow用户

发布于 2016-07-05 21:26:12

您不能使用嵌套的ng-app指令。为了解决这个问题，你可以创建一个“父”应用程序来整合其他应用程序，如下所示：

var rootApp = angular.module('rootApp', []);
var editorApp = angular.module('editorApp', []);
var mainApp = angular.module('mainApp', ['rootApp', 'editorApp']);

rootApp.controller('rootController', function($scope) {
  $scope.name = 'root app';
});

editorApp.controller('editorController', function($scope) {
  $scope.name = 'editor app';
});

<!DOCTYPE html>
<html ng-app="mainApp">

<head>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>      
  </head>

<body>
  <div ng-controller="rootController">
    <p>Hello {{name}}!</p>
  </div>
  <div ng-controller="editorController">
    <p>Hello {{name}}!</p>
  </div>
</body>

</html>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/38204340

复制

相似问题

问在同一页面mvc视图中多次使用相同的ng-app和ng-controller
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在同一页面mvc视图中多次使用相同的ng-app和ng-controllerEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问在同一页面mvc视图中多次使用相同的ng-app和ng-controller
EN