Angular 决定何时出现名称冲突的规则

Question

全部：

我是 Angular 的新手，我想知道当我包含多个模块时，如果有相同的名称 controller/service 等，angular 如何决定使用哪个？

谢谢

Answer 1

这是Angular模块系统的一个限制。有效解析依赖时的操作顺序为：

主模块
最后注册的依赖模块

想象一下以下设置：

angular.module('alpha', [])
  .service('fooService', fooService);

angular.module('beta', [])
  .service('fooService', someOtherFooService);

angular.module('my-app', ['alpha', 'beta']);

在这种情况下，someOtherFooService 将始终是在您的应用程序中请求它时注入的依赖项。

现在如果我们把上面的例子修改成这样：

angular.module('alpha', [])
  .service('fooService', fooService);

angular.module('my-app', ['alpha'])
  .service('fooService', myFooService);

然后 myFooService 将永远是注入的那个，因为它是主模块。

您可以在下面的示例中看到一个更深入的例子，说明它是如何发挥作用的。

(function() {

  function serviceFactory(msg) {
    return function() {
      this.sayHello = function() {
        return msg;
      };
    }
  }

  function rollupService(alphaService, betaService, gammaService, deltaService) {

    this.rollup = function() {
      return [
        alphaService.sayHello(),
        betaService.sayHello(),
        gammaService.sayHello(),
        deltaService.sayHello(),
      ].join(" | ");
    };
  }

  angular.module('alpha', [])
    .service('alphaService', serviceFactory("alpha module"))
    .service('betaService', serviceFactory("alpha module"))
    .service('gammaService', serviceFactory("alpha module"))
    .service('deltaService', serviceFactory("alpha module"))
    .service('rollupService', rollupService)
    .run(function(rollupService, $rootScope){
      $rootScope.rollup = rollupService.rollup();
    });

  angular.module('beta', [])
    .service('betaService', serviceFactory("beta module"))
    .service('gammaService', serviceFactory("beta module"))
    .service('deltaService', serviceFactory("beta module"))

  angular.module('gamma', [])
    .service('gammaService', serviceFactory("gamma module"))
    .service('deltaService', serviceFactory("gamma module"))

  angular.module('my-app', ['alpha', 'beta', 'gamma'])
    .service('deltaService', serviceFactory("my-app module"))
    .controller('myCtrl', function(alphaService, betaService, gammaService, deltaService) {
      this.alphaService = alphaService;
      this.betaService = betaService;
      this.gammaService = gammaService;
      this.deltaService = deltaService;
    });

}());

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<div ng-app="my-app" ng-controller="myCtrl as ctrl">
  <h3><code>alphaService.sayHello() = </code>{{ctrl.alphaService.sayHello()}}</h3>
  <h3><code>betaService.sayHello() = </code>{{ctrl.betaService.sayHello()}}</h3>
  <h3><code>gammaService.sayHello() = </code>{{ctrl.gammaService.sayHello()}}</h3>
  <h3><code>deltaService.sayHello() = </code>{{ctrl.deltaService.sayHello()}}</h3>
  <hr />
  <p>Alpha modules dependencies are controller by the application, not how it defined
  it's own dependencies. So watch out cause this could break things.</p>
  <p>This code is run from alpha module's <code>.run</code> block.</p>
  <h3>{{rollup}}</h3>
</div>

Angular 决定何时出现名称冲突的规则

Angular rule to decide when there is name conflict

module

angularjs