Angularjs $stateProvider 和单例服务问题

Question

我正在使用 angular-ui-router 使我的应用程序按路由组织，但我有点困惑。据我所知，我必须在模块中添加 'ui-router' 依赖项才能使用 $stateProvider。但即使我没有添加 'ui-router' 依赖项，它也运行良好。

我知道 angular 服务是单例对象，所以如果我只添加一次 'ui-router' 依赖项。我可以在任何模块中使用 $stateProvider 服务吗？

下面的代码是 angular 在我的应用程序中定义的代码。

angular.module('app', ['ui-router','app.pages']);

angular.module('app.pages', ['app.pages.core']);


angular.module('app.pages.core',[])
    .config(function ($stateProvider, $urlRouterProvider) {

    $stateProvider
        .state('common.default', {
            abstract: true,
            views: {
                header: {
                    templateUrl: '/public/app/common/components/header/header.html',
                    controller: 'headerController'

                },
                content: {
                    template: '<div ui-view></div>'
                }
            }
        })
        .state('common.default.core', {
            url: "/goongles/",
            templateUrl: "/public/app/pages/core.html",
            controller: 'coreController'
        });
});

查看代码

<div ui-view="header"></div>
<div ui-view="content" class ='view ng-scope openm'></div>

请给我任何想法。谢谢

Answer 1

把它想象成一棵树。树的根是您在 ng-app 指令中设置的任何模块。当 Angular 处于 bootstraping 时，它从那里开始，并加载所有模块组件及其依赖项的组件。一旦 bootstrap 完成，生命周期将继续（创建常量，然后是提供者，然后是运行配置块，等等）。

由于您的应用中某处依赖于 ui-router，因此其所有服务在 bootstrap 后可用。

无论如何，您不应该依赖它来让您的模块工作。如果您要在另一个不依赖于 ui-router 的应用程序中使用您的 app.pages.core 模块，那么它将无法工作。

Answer 2

当您创建一个 angular 模块时，始终在该模块中指定使用的依赖项 即使您已经在另一个模块中指定了相同的依赖项.

请记住，每个模块都应该是自给自足的，并且应该在不依赖于其他模块依赖关系的情况下工作，以便完全可重用。

所以要正确回答您的问题.. 是的，您可以在任何模块中使用 $stateProvider，但要在每个模块中添加 ui-router 依赖项。

Angularjs $stateProvider 和单例服务问题

Angularjs $stateProvider and singleton service issue

angularjs

angular-services

angular-ui-router