想在一个应用程序中使用多个ng-app

时间:2016-06-06 09:22:30

标签: angularjs angularjs-interpolate

我正在开发一个应用程序,其中定义并使用了多个ng-app。最初在不同页面上的ng-app没有冲突,因为所有页面都是独立的,但现在我必须包含一个标题,标题已经定义了自己的ng-app。

我使用两种不同的方法来避免标头应用与其他网页应用的冲突。

第一种方法: 在每个页面上手动引导应用程序:

angular.bootstrap($('#mycontact_container'),['contactsApp']);

OR

 angular.element(document).ready(function() {

    angular.bootstrap($('#topNavigation'),['headerApp']);

});

第二种方法:

angular.module("rootApp", ["headerApp", "contactsApp"]);

其中rootApp是在body标记中定义的应用程序,其中将包含整个应用程序。 headerApp是在每个页面的标题上定义的应用程序,contactsApp是一个自定义html页面的应用程序。

第一种方法错误:

  

错误:[$ injector:modulerr]   http://errors.angularjs.org/1.4.8/ $注射器/ modulerr P0 = headerApp&安培; P1 =%5B%24injector%3Amodulerr%5D%20http%3A%2F%2Ferrors.angularjs.org%2F1.4.8%2F%24injector%2Fmodulerr%3Fp0

第一种方法的OR部分错误:

  

错误:[ng:btstrpd]   http://errors.angularjs.org/1.4.8/ng/btstrpd?p0=%26lt%3Bsection%20id%3D%22topNavigation%22%20class%3D%22top-navigation%20ng-scope%22%20ng-app%3D%22headerApp%22%26gt%3B

     

... f e?JSON.stringify(e):e; d + = c(e)} return Error(d)}} function   ZA的(a){如果(空==一个|| XA(一...

即app已经自助了。

第二方法问题: 没有错误但是当我尝试在我的应用程序中使用插入提供时,它包含在标题中,即使用以下代码将包含在整个应用程序中:

headerApp.config(['$interpolateProvider',

    function($interpolateProvider) {
        $interpolateProvider.startSymbol('{$');
        $interpolateProvider.endSymbol('$}');
    }
]);

    app.controller('MainController', ['$scope', '$http',function MainController($scope, $http) {

        $scope.first_name = "abc";
});

在我的视图中,我没有使用{$ first_name $}打印任何内容。最终我的应用程序行为不端。我已将此问题发布在不同的帖子中SO question  任何人都可以指导我需要遵循什么来纠正我的应用程序与现有架构的行为。 我想只有棱角分明的专家才能在这里指导我。

如果需要更多细节,请告诉我。

更新

当我手动引导app时,我遇到了以下错误:

  

错误:[ng:btstrpd]

因为我在html中使用ng-app。 手动引导应用时,则不需要ng-app。

0 个答案:

没有答案