Question

我正在构建一个由各种模块组成的大型角度应用程序

- app
  -- member
    --- newMember
    --- memberDashboard
  -- linguistics
  -- etc
     --- etc etc

在html中我实例化单个模块，因为我认为相对于整个app的引导有一个性能提升。

<div ng-app="linguistics">
    <div ui-view autoscroll="true"></div>
</div>

然而，这意味着我必须在模块配置中重复自己。即：

angular.module('linguistics', [
    'ui.router',
    'ui.bootstrap',
    'googlechart',
    'babelServices',
    'babelFilters'
]).config(function($stateProvider, $urlRouterProvider, $locationProvider, $httpProvider) {
    $locationProvider.html5Mode(true);
}).config(function($provide) {
    return $provide.decorator('$uiViewScroll', function($delegate, $window) {
        return function(uiViewElement) {
            //eventually do something more intelligent with the uiViewElement
            return $window.scrollTo(0, 0);
        };
    });
});

html5Mode，scrollTo等将在模块之间重复。有更好的方法吗？

Answer 1

我将添加一个配置模块，它将处理设置html5Mode，scrollTo等的繁琐工作。

angular.module('configuration', ['ui.router'])
  .config(function ($locationProvider, $provide) {
    $locationProvider.html5Mode(true);

    // For angular 1.3
    $locationProvider.html5Mode({
      enabled: true,
      requireBase: /* true/false */
    });

    $provide.decorator('$uiViewScroll', function ($delegate, $window) {
      return function (uiViewElement) {
        return $window.scrollTo(0, 0);
      }
    });
  });

然后在随后的模块中：

angular.module('linguistics', ['configuration']);

我应该在大角度应用程序中实例化一个子模块

1 个答案: