ホームページ > ウェブフロントエンド > jsチュートリアル > AngularJS モジュール管理の問題を処理する型破りな方法_AngularJS

AngularJS モジュール管理の問題を処理する型破りな方法_AngularJS

WBOY
リリース: 2016-05-16 16:01:42
オリジナル
1334 人が閲覧しました

1.原因

私は winform に取り組んでおり、幸運なことに、node.js、express、angularJS などの多くのオープンソース フレームワークを統合するプロジェクトをマスターから引き継ぎ、すぐに棚に並べることができました。そこで私は、過去のアイデアを活用しながらコードを整理し、リファクタリングしました。

2. 質問

特定の環境では、BootStrap のモーダル ボックスを使用する必要があります。Win から学習していますか? 。 当然のことながら、boostStrp モーダル ボックスをユニバーサルなものに統合し、どこでも呼び出すことを考えました。 。 。

そのため、ダイアログ ファイルは patial を使用して参照され、ダイアログ ボックス自体はサーバー関連の通信に anglurJS を使用します。

後で、1 つだけを使用するとうまく動作することがわかりました。複数回参照されると (異なるデータを呼び出すと)、1 つだけが動作します。 。

3. 分析

いくつかの情報を確認したところ、angular.bootstrap の呼び出しはページ上で 1 回しか実行できないことがわかりました。また、以前にすべての angular.module を別々の JS ファイルに記述しました。 time JS ファイルは最終的に angular.bootstrap を呼び出すため、当然失敗します。

4.楽しみにしてます

そこで、さまざまなファイルをページに部分的に自由に追加でき、js ファイルが繰り返し参照されず、AngulurJS も完全に実行できるソリューションメカニズムが必要です。

5.解決策

親愛なる皆さん - この方法は少し嫌なものですが、間違いなく直接的で効果的です。

アイデアは、すべての AngularJS モジュールをグローバル配列で動的に維持し、それらを動的にロードすることです

もう話す必要はありません。コードを投稿するだけです

フレーム ページ (レイアウト...) の先頭にある angulurinit.js ファイルを参照します。コードは次のとおりです:


Array.prototype.indexOf = function (val) { 
  for( var i = 0; i < this.length; i++) {
    if(this[i] == val) return i;
          }
  return - 1;
      };
var jsModules = new Array();
function Confirm(val){
  if (jsModules.indexOf(val) > -1)
    return;
  else
    jsModules.push(val);

};

ログイン後にコピー
各 angul.js モジュールの
を置き換えます

コードをコピーします コードは次のとおりです:
angular.bootstrap(document, [モジュール名]);


を に置き換えます

コードをコピーします コードは次のとおりです:
確認(モジュール名);


レイアウトの最後に angulur.js ファイルを追加します (レイアウト ページ ? 何と呼ばれるかはわかりませんが、とにかく、パブリック フレーム ページです)。コードは次のとおりです。

コードをコピーします コードは次のとおりです:
(関数() {
var app = angular.module('app', jsModules);
Angular.bootstrap(document, ['app']);
})();


ふふ〜〜気持ち悪いです。 。 。 病気になりますか?

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート