mgcrea.ngStrap
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.
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.ngStrap
module into your application.
angular.module('myApp', ['mgcrea.ngStrap']);
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.
AngularStrap provides independently built modules that can be loaded separately
angular.module('myApp', [ 'mgcrea.ngStrap.modal', 'mgcrea.ngStrap.aside', 'mgcrea.ngStrap.tooltip' ]);
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
AngularStrap leverages AngularJS
ngAnimate
module to provide animations to the directives. Therefore, it requires to load custom CSS code as
ngAnimate
comes with a very specific markup.
Theses docs rely on the
angular-motion.css
stylesheet from the AngularMotion project.
$ bower install angular-motion --save