[WebApp][AngularJS] Twitter BootstrapをAngularJS上でdirectiveとして使うライブラリ

Angular JS上で使えるUIライブラリとしてAngular UIというプロジェクトがあるのですが、その中にTwitter Bootstrapの一部ををAngularJSのdirectiveとして使えるようにしたものがあり、便利そうだったので導入してみました。

Angular directives for Twitter's Bootstrap

自分はYeomanを用いて環境を構築していたので、Bowerでインストールしました。
その際の手順を以下に記しておきます。

1. bower.jsonのdependenciesに"angular-bootstrap": "*"を追加

   "dependencies": {
       "angular": "~1.0.7",
       "..,
       "angular-bootstrap": "*"
     },

2. bower installを実行

$ bower install

3. index.htmlでjavascriptファイルを読み込む
   

   <script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>

4. 'ui.bootstrap'モジュールをインポート
   

   angular.module('HogeApp', ['ui.bootstrap'])

タブやプログレスバーといったよく使うUIパーツがdirectiveとして利用できるので、素早くUIを構築する際には重宝しそうですね。