2016-12-17 8 views
1

私はAngularJS v1.4.3を使ってMEANプロジェクトを持っています。私はナビゲーションメニューにドロップダウンアイテムを挿入する必要があるので、次のようにインストールして、angle-ui/bootstrapをインストールし、使用してください:
- パッケージを
でインストールしてください。npm install uu-bootstrap
- モジュールをアプリケーションに追加します。
angular.module( 'usermgmtApp'、['ngRoute'、 'ui.bootstrap']);
- ドロップダウンのメニュー項目を実装するために、次のコードを使用します。
angle-uiをインストール

<ul class="nav navbar-nav"> 
    <li><a href="/">Home</a></li> 
    <li uib-dropdown on-toggle="toggled(open)"><!-- Simple dropdown --> 
     <a href id="simple-dropdown" uib-dropdown-toggle> 
      Click me for a dropdown, yo! 
     </a> 
     <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button"> 
      <li role="menuitem"><a href="#">Action</a></li> 
      <li role="menuitem"><a href="#">Another action</a></li> 
      <li role="menuitem"><a href="#">Something else here</a></li> 
      <li class="divider"></li> 
      <li role="menuitem"><a href="#">Separated link</a></li> 
     </ul> 
    </li> 
    <li><a href="applications">Next</a></li> 

ドロップダウン部分のコードは、(ターゲットなし「のhref」を含むhttps://angular-ui.github.io/bootstrap/からコピーされたスニペットですが、私はと私はそれをそのまま取る角度を学ぶ)。 それだけです。アプリケーションを実行するとランディングページが表示されないので、モジュールをインストールする際に、ここで何か不足しています(コードを/ publicでダウンロードする必要がありますか?どこかのコードにいくつかの "インポート"を含める必要があります...)。繰り返しますが、私はあなたの助けに感謝する角度のギターの指示と混同しています。ロケット科学が、ここでは土地もnewbeesため、おそらく有用ではありません おかげ

+0

コンソールにエラーがありますか? – ndoes

+0

あなたのindex.htmlにangle-ui-bootstrapをインポートすることができないかもしれません shall

+0

私はindex.htmlで参照しました。 のnpmがインストールされたモジュール。アプリケーションが開かれず、2つのコンソールエラーがあります。Uncaught SyntaxError:予期しないエラーが発生しました(キャッチエラー:[$ injector:modulerr] –

答えて

1


- (ノードJSのためのNPMのような)角度JSパッケージマネージャをインストールします。プロジェクトのルートフォルダに、コンソールから実行します。
NPMは、-g亭に
バウアーの初期化(この設定ファイルを作成しますbower.json)
をインストール - コンソールからの角度-UI-ブートストラップを取り付ける:
亭インストールアンギュラブートストラップ--save
(これは、プロジェクトのルートフォルダにbower_components /角度-UI-ブートストラップエントリが作成されます)
- app_clientに/ main.jsがangular.module配列
の 'ui.bootstrap' を追加 - app_client/index.htmlの挿入で、他のすべての角度jsのlibファイルの後:

<script src="lib/angular/ui-bootstrap-tpls-2.3.1.min.js"></script> 
      (the file name should be the same as the one installed by bower in that folder)<br> 
    - insert the code where you want to use ui.bootstrap components, following the 
    snippet guidance from https://angular-ui.github.io/bootstrap<br> 

HTH