1

大きな angular.js アプリ (1.5.9) を最新バージョンの Angular にアップグレードしようとしています。

私はアプリをハイブリッド AngularJs/Angular アプリに変換する過程にあり、ガイドのこのステップに到達しました:

https://angular.io/guide/upgrade#bootstrapping-hybrid-applications

これまでのところ、gulp の使用から webpack 4 に変更しましたが、アプリは以前と同じように動作しています。

私が抱えている問題は、index.html での ng-app ディレクティブの使用から Javascript でのブートストラップに切り替えると、アプリの起動に失敗し、次のエラーがスローされることです。

キャッチされないエラー: [$injector:unpr] 不明なプロバイダー: StateServiceProvider <- StateService

これは、次のような app.js ファイルからのものです。

angular.module('app-engine', [
    'app-engine.state',
    'app-engine.api',
    // other modules
])
.factory('bestInterceptor', bestInterceptor)
// other configs which aren't throwing Unknown provider errors
.run(startUp);

bestInterceptor.$inject = ['StateBootstrappingService'];

function bestInterceptor(StateBootstrappingService) {
    return {
        request: config => {
            if (!StateBootstrappingService.isBestSsoOn()) {
                config.headers['x-impersonated-user'] = StateBootstrappingService.getUserName();
            }
            return config;
        }
    };
}

startUp.$inject = ['$rootScope', '$state', '$timeout', 'StateService']

function startUp($rootScope, $state, $timeout, StateService) {
    // start up code
}

アプリ内の他のモジュールを定義する別の app.modules.js ファイルがあります。

含む:

angular.module('app-engine.state', ['rx', 'app-engine.api']);

不明なプロバイダー エラーに記載されているサービスは次のようになります。

(function() {
    'use strict';
    angular
        .module('app-engine.state')
        .factory('StateService', StateService);

    StateService.$inject = [
        '$state',
        '$log',
        'rx',
        // a few other services that exist in the app
    ];

    function StateService(
         // all the above in $inject
    ) {
         // service code
    }
})();

ガイドの指示に従って、index.html から ng-app="app-engine" を削除し、代わりに JavaScript に追加しています。app.modules.js ファイルの一番下に追加しました。

angular.bootstrap(document.body, ['app-engine']);

この変更の後、不明なプロバイダー エラーがスローされます。ソースが app.js の startUp 関数であることを確認しました。アプリのすべてのモジュールを「app-engine」requires配列に含めてみましたが、何も変更されませんでした。サービスも使用しているにもかかわらず、bestInterceptor 関数がエラーをスローしていないのは興味深いことです (StateBootstrappingService は StateService と同じ方法でセットアップされています)。

私が間違っていることは明らかですか?または、これを解決する方法を知っている人はいますか?

4

1 に答える 1