如何处理Angular模块间的ui-router

Question

在angular中，你可以拆分模块之间的功能，以支持多个应用。例如，如果我有两个应用程序，它们都可以使用相同的"User"模块，我可以把这个模块包含在两个应用程序中。

angular.module('User', []); // include a bunch of user stuff
angular.module('App1', ['User']);
angular.module('App2', ['User']);

这对任何人来说都不新鲜。但是对于ui-router，我还想在模块中定义状态。

angular.module('User').config(function($stateProvider) {
  $stateProvider.state('user', {})
  .state('user.profile', {});
});

问题是我想要user和user.profile作为一个应用程序状态的子状态。比如- root.users.user.profile。但是我不想让User模块知道这些。User模块应该只在它的小视图中定义状态。

是否可以附加已经定义的状态?如何在这样的模块中编写状态，使其保持模块化?

Answer 1

是的，完全可以定义状态并在另一个模块中使用它。您需要注意的是，模块中不应该有任何循环依赖。并且正确的模块被作为依赖项注入到其他模块中。

你可以这样做:

angular.module('App1', ['User']).config(function($stateProvider){
    $stateProvider
      .state('root', {})
      .state('root.users', {});
})
angular.module('User').config(function($stateProvider) {
      $stateProvider.state('root.users.user', {})
      .state('root.users.user.profile', {});
    });

我希望这对你有帮助:)