ocLazyLoadを使用してjsの遅延ロードを実装するにはどうすればよいですか?-jsチュートリアル-php.cn

ocLazyLoadを使用してjsの遅延ロードを実装するにはどうすればよいですか?

零下一度

リリース： 2017-07-18 17:48:29

オリジナル

1283 人が閲覧しました

OcLazyLoadの説明

1.ocLazyLoadはAngularJSのサードパーティライブラリであり、モジュール、コントローラー、その他の依存関係の動的読み込み/オンデマンド読み込みを実現できます

2.$ocLazyLoad.load()は複数のファイルをサポートしており、自動的にロードできます指定したファイルタイプを定義し、それをクライアントにキャッシュするかどうかをカスタマイズできます

3. $ocLazyLoad.load() は動的タイプ $$state を返しますが、関連するものはありません。存在しない、またはロードに失敗した js ファイルを処理するための API

最近、angular を使用して html フラグメントをルーティングするシステムを開発しているときに、リッチテキストを実装するために js プラグインを使用する必要があるという問題に遭遇しました。編集者。重要な問題は、フラグメントがロードされた後、js を介して dom 要素にバインドする必要があることです。最初は、コードスニペットに JS コードを直接記述しても問題ないと考えましたが、試してみると、ルーティングが HTML フラグメントをページに挿入するとき、CSS を読み取ることしかできず、JS コードを解析して実行することはできません。。

長い間グーグルで検索した結果、angular+requireJsのソリューションがたくさん見つかりましたが、requirejsは本質的にモジュールローダーであり、オンデマンドの読み込みは単なる副業であるため、私のシナリオには適していないと思います。モジュール式に設計されているため、純粋にオンデマンド読み込みのためにコードをラップ (定義) する場合、私のニーズでは、コストが膨大になります。。

最終的に、ocLazyLoad を使用して処理することにしました。このソリューションの利点は、シンプルで実装が簡単で、侵入的ではないことです。同時に、このソリューションには、必要なスクリプトやテンプレートリソースを動的に読み込むたびに多くの不必要なネットワークオーバーヘッドが発生すること、ルーティング定義が比較的複雑であることなど、いくつかの欠点があります (追加の構成項目がいくつかあるため、実際には複雑ではありませんが、大規模かつ複雑なビジネスアプリケーションやルートが多く、消費されるエネルギーは無視できません。でも、私の状況にはちょうどいいです。そこで、github で js をフォークしてプロジェクトに導入しました。

 <script src="js/ocLazyLoad.js?1.1.11"></script>

ログイン後にコピー

使用する必要があるAngularモジュールで設定します

var app = angular.module(&#39;formCtrlParts&#39;, [&#39;oc.lazyLoad&#39;]);

ログイン後にコピー

次に、ルーティングに使用する必要があるコントローラーでこのサービスを使用して、オンデマンドでjsファイルをロードします

app.controller(&#39;addNewBlogCtrl&#39;,function($scope,$http,$ocLazyLoad){
    $ocLazyLoad.load(&#39;../html/ckeditorjs/ckeditor.js&#39;);
   
})

ログイン後にコピー

ocLazyLoad には多くのロードメソッドがあり、ルーティングや命令を使用してロードすることもできます。

以上がocLazyLoadを使用してjsの遅延ロードを実装するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。