Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
14
Help us understand the problem. What is going on with this article?
@damele0n

AngularJS で controller, service 等を遅延ロード(定義)する

More than 5 years have passed since last update.

AngularJS で controller, service などが定義された JavaScript ファイルを遅延ロードした場合、通常のような書き方では Injector から対象のオブジェクトが取得できない。なので、以下のようにする。

※公式的にこれでいいのかどうかは不明だけどメソッドが生えてるってことはこれでいいのかしら。ちなみにソースはこれ

メインのファイル
main.js
var app = angular.module('sample', []);

// Config で、遅延ロード(定義)する対象のプロバイダーを config 内で app へ alias をはっておく
app.config(['$provide', '$controllerProvider', '$animateProvider', '$filterProvider', '$compileProvider',
    function($provide,   $controllerProvider,   $animateProvider,   $filterProvider,   $compileProvider) {

        // Service 系 (service, factory, value, constant) は $provide
        app.$provide = $provide;

        // あとは名前の通り
        app.$controllerProvider = $controllerProvider;
        app.$animateProvider = $animateProvider;
        app.$filterProvider = $filterProvider;
        app.compileProvider = $compileProvider;
}]);

app.controller('mainController', ['$injector', function($injector) {
    // 以下の lazy.js を読み込むとして
    loadScript().then(function() {
        // ここで読み込んだファイル内に定義した各オブジェクトを $injector から取得できる
        var lazyService = $injector.get('lazyService');
    });
}]);
遅延ロードされるファイル
lazy.js
var app = angular.module('sample');

//////// service を定義
// $provide にはその他、.factory(), .value(), .constant() というメソッドが生えてるので、以下と同様に使用できる
app.$provide.service('lazyService', function() {

});

//////// controller を定義
// ${hoge}Provider というプロバイダーは、 .register() メソッドで定義を行うので注意
app.$controllerProvider.register('lazyController', function() {

});

ちなみに angular-loader とか非同期でスクリプトを読み込む系のプラグインも、上記と同じようなことを行って実現しているっぽい(流し見した)

僕は FlashCC からはき出した CreateJS の中に API として AngularJS のオブジェクトを定義した時に通常の記法だと $injector から取得できず、どうしていいのか分からなかったので上記のような方法をとりました。

14
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
damele0n

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
14
Help us understand the problem. What is going on with this article?