#ng-bs-animated-button
Angular/Bootstrap animated submit button directive.
Demo
http://jeremypeters.github.io/ng-bs-animated-button/
Usage
- Install via Bower:
bower install ng-bs-animated-button
-
Include ng-bs-animated-button.js
and ng-bs-animated-button.css
in your app. They should be located at bower_components/ng-bs-animated-button/
.
-
Add jp.ng-bs-animated-button
as a module dependency to your app:
angular.module('yourApp', ['jp.ng-bs-animated-button']);
- Add the directive with the required attributes to your template:
<jp-ng-bs-animated-button is-submitting="isSubmitting" result="result" options="options"></jp-ng-bs-animated-button>
- Add the required scope variables and any options to your controller:
app.controller('yourCtrl', function($scope) {
$scope.isSubmitting = null;
$scope.result = null;
$scope.options = {
buttonDefaultText: 'Lorem ipsum',
...
};
});
Options
Option | Default |
---|
buttonDefaultClass | 'btn-primary' |
buttonSubmittingClass | 'btn-primary' |
buttonSuccessClass | 'btn-primary' |
buttonErrorClass | 'btn-danger' |
buttonDefaultText | 'Submit' |
buttonSubmittingText | 'Submitting...' |
buttonSuccessText | 'Completed' |
buttonErrorText | 'There was an error' |
buttonInitialIcon | 'glyphicon glyphicon-plus' |
buttonSubmittingIcon | 'glyphicon glyphicon-refresh' |
buttonSuccessIcon | 'glyphicon glyphicon-ok' |
buttonErrorIcon | 'glyphicon glyphicon-remove' |
formIsInvalid | '' |
animationCompleteTime | '2000' |
iconsPosition | 'left' |
onlyIcons | false |