1

私は AngularJS と ocLazyLoad プラグインを使用しています。そして、私は自分の問題の解決策を見つけることができません。

1つのコンポーネント（という名前component.js）とこのコンポーネントのコントローラー（別のファイルcomponentCtrl.js）を作成し、コントローラーで使用する定数を作成しました（別のファイルにもありますconstants.js）。そして、これらのファイルをロードする必要があります。次のようなものを使用すると：

loadPlugin: function ($ocLazyLoad) {
                    return $ocLazyLoad.load(
                        {
                            files: ['../componentCtrl.js','../constants.js',../,'component.js']
                        },...

私の依存関係は正常にロードされます。しかし、より多くのビューでこのコンポーネントが必要です。次に、このコードを何度も書かなければなりません。遅延読み込み関数で使用する前に、このリソースの配列を定義できますか?

モジュールがあれば、簡単です

$ocLazyLoadProvider.config({
  modules: [{
    name: 'TestModule',
    files: ['source1', 'source2',..., 'sourceN']
  }]
});

しかし、このコンポーネント用の特別なモジュールはありません。このプラグインで可能ですか?

4

1 に答える 1

1

次のように、定数またはグローバル変数を定義して、そこにすべてのコンポーネント ファイルを追加できます。

angular.module('app')
        .constant('SIMPLE_COMPONENTS', {
            comp1: ['../componentCtrl.js', '../constants.js', 'component.js'],
            comp2: ['../componentCtrl2.js', '../constants2.js', 'component2.js'],
            compfoo: ['../componentfoo.js', '../constantsbar.js', 'componentfoo.js']
        });

次に、状態構成内で関数を次のように定義します。

function getMeFoo(src) {
    return ['$ocLazyLoad', 'SIMPLE_COMPONENTS', function ($ocLazyLoad, SIMPLE_COMPONENTS) {
        if (SIMPLE_COMPONENTS[src]) {
            return $ocLazyLoad.load(SIMPLE_COMPONENTS[src]);
        }
    }]
}

状態構成でそれらを使用するだけです。

.state('app.foo', {
    url: '/foo',
    templateUrl: 'views/foo.html',
    resolve: {
        dep1: getMeFoo('comp1')
    }
})

.state('app.bar', {
    url: '/bar',
    templateUrl: 'views/bar.html',
    resolve: {
        dep1: getMeFoo('comp1'),
        dep2: getMeFoo('comp2')
    }
});
于 2016-10-29T03:48:33.297 に答える