2013-07-17 50 views
14

私はWebアプリケーションを開発中です。私はすべてのファイルをUIに動的に読み込むためにAngularJSを使用しています。
1.私はindex.htmlを持っています。その上にすべてのファイルがクリックまたはロード時に動的に読み込まれます。Angular JS:CSSとJSファイルを動的に読み込みます。

//index.html 
    <signin button> <signup button> // etc., 
    //on-clicking signin button a SignIn-page will load in the below div 

    <div id="bodyview"></div> 
    // end of index.html 

今私のサインインページが多少以下のような構造

/*a div where my accordion menu will load when the 
    *below submit button is clicked*/ 

    <div id="menu"></div> 

    //other sign-in-form stuff will follow on... 

    //submit button at the end 
    <submit button> //only on clicking the submit button the menu will be loaded 

に見える今、私の問題は、私はアコーディオンmenu.htmlファイルをロードすることができるよけれども、私はできないんだけど、ありますそれが依存しているcssとjsファイルをロードする。私はstackoverflowの議論の多くを見てきましたが、誰も私のために働いていませんでした。
Angular JS ...を使用して、cssとjsの依存関係をロードする方法を決定する際に助けてください。
ご了承ください。事前に感謝

答えて

18

ただ、ここで<head>

にCSSやJSファイルを追加するサービスを書くには、動的にCSS files.Youは、JSファイルをロードするために簡単に変更することができますロードするために使用される例サービスです。

https://github.com/Yappli/angular-css-injector

+2

JSファイルの挿入にも使用できますか? –

+0

これはIE7/8では動作しない可能性があります。 http://stackoverflow.com/a/4754995/634204 –

+0

jsファイルを使用して追加する方法を教えてください。例えばコントローラ。 –

0
app.controller('MyCtrl', function($scope,$compile) { 
$("#my").append($compile("<script src='my.js'>")($scope)); 
}); 
+1

はい!これは間違った方法です。 http://docs.angularjs.org/guide/directiveを参照してください。 –

+0

コントローラでDOM操作を行うべきではありません。これは、角度 – ehsan88

1

代わりAngularJSの方法で行くのは、私はjQueryのを使用してファイルをロードしようとしました。それは私のために働いた。 You can check this link for reference

+1

を使用するときの落とし穴の1つです。ここでは、なぜ「jQueryを使用しないのですか」という回答が表示されないと思いました。 route ... –

+0

OPはAngularJSを使用してファイルをロードしようとしていました。 JQueryのようなライブラリをファイルをロードするだけで追加するのは良い解決策ではありません。これは、[こちら](http://www.w3.org/wiki/Dynamic_style_-_manipulating_CSS_with_JavaScript)に記載されているように、プレーンなjavascriptでも行うことができます。 –

関連する問題