有2个应用程序或一个应用程序与多个模块

时间:2016-01-09 05:07:31

标签: angularjs twitter-bootstrap angular-ui-router angular-module

我正在使用棱角分明,我想知道哪一个更好。我有我的模板,我已分为页眉,页脚,侧面菜单和主要内容。我想知道是否每个部分使用一个模块,然后使用另一个模块来封装较小的模块,或者让每个模块使用不同的ng-app然后再引导。我想知道在性能和最佳实践方面的差异。

暂时我用UI路由器实现如下: -

视图

<div  ng-app="baseModule" ng-controller="baseController as base" >
  <div ui-view >

  </div>
</div>

路由: -

 $stateProvider.state('root-profile', {
        abstract: true,
        views: {
            '@': {
                templateUrl: 'app/shared/base-profile/base-profile-view.html',
                controller: 'baseProfileController'
            },
            'header@root-profile': {
                templateUrl: 'app/shared/header-profile/header-profile-view.html',
                controller: 'headerProfileController'
            },
            'leftSideBar@root-profile': {
                templateUrl: 'app/shared/sidebar/left/left-side-bar-view.html',
                controller: 'leftSideBarController'
            },
            'rightSideBar@root-profile': {
                templateUrl: 'app/shared/sidebar/right/right-side-bar-view.html',
                controller: 'rightSideBarController'
            },
            'footer@root-profile': {
                templateUrl: 'app/shared/footer-profile/footer-profile-view.html',
                controller: 'footerProfileController'
            }

        } //END views
    }); //END state

    $stateProvider.state('profile', {
        url: '/profile',
        parent: 'root-profile',
        views: {
            'mainContent': {
                templateUrl: 'app/components/profile/profile-view.html',
                controller: 'profileController'
            }

        } //END views
    }); //END state

我有一个base-profile-view.html,其中包含要注入的各个部分。他们每个人都有一个不同的模块。然后我将每个部分模块包含在基本配置文件视图中

var baseProfileModule = angular.module("baseProfileModule", [
    'ui.router'
    , 'footerProfileModule'
    , 'headerProfileModule'
    , 'rightSideBarModule'
    , 'leftSideBarModule'
    , 'profileModule'
]);

然后我有另一个主模块,其中包含baseProfileModule: -

var baseModule = angular.module("baseModule", [
    'ui.router'
    ,'baseProfileModule'
    ,'baseSearchFrontModule'
]);

现在我想知道的是这是一种很好的做事方式,或者还有其他更好的方法可以做到这一点。

0 个答案:

没有答案