About the project

AngularStrap is a set of native directives that enables seamless integration of Bootstrap#^3.0 into your AngularJS#^1.2 application.

With no external dependency except the Bootstrap CSS styles, AngularStrap is light and fast. It has been built from the ground up to leverage ngAnimate!

AngularStrap is tested against the latest patch release of the 1.2, 1.3 and 1.4 branches.

Quick Start

Install and manage AngularStrap with Bower. You can also use NuGet. A CDN is also provided by cdnjs.com.

      
        $ bower install angular-strap --save
      
    

Load the required javascript libraries (Bootstrap scripts files are not needed).

      
<script src="//ajax.googleapis.com/ajax/libs/angularjs/{{ ngVersion }}/angular.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-strap/{{ version }}/angular-strap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/angular-strap/{{ version }}/angular-strap.tpl.min.js"></script>

Inject the mgcrea.ngStrapmodule into your application.

      
        angular.module('myApp', ['mgcrea.ngStrap']);
      
    

Why are there two angular-strap files?

AngularStrap provides two different files:

By keeping the HTML template definitions in a separate file, it makes it easier to customize the templates used by the directives by creating a custom copy of the file or by overriding some of the templates.

Custom builds

AngularStrap provides independently built modules that can be loaded separately

        
          angular.module('myApp', [ 'mgcrea.ngStrap.modal', 'mgcrea.ngStrap.aside', 'mgcrea.ngStrap.tooltip' ]);
        
      

Contribute

Build and work on AngularStrap with Gulp.

      
        // Serve and watch docs, ideal to hack!
        $ gulp serve
        // Continuous integration
        $ gulp karma:server
        // Build AngularStrap
        $ gulp build
      
    

Animations

AngularStrap leverages AngularJS ngAnimatemodule to provide animations to the directives. Therefore, it requires to load custom CSS code as ngAnimatecomes with a very specific markup.

AngularMotion

Theses docs rely on the angular-motion.cssstylesheet from the AngularMotion project.

        
          $ bower install angular-motion --save