A complete AngularJS service with controllers and templates for generating application modals and dialogs for use with Angular-UI-Bootstrap and Twitter Bootstrap
Demos
Release Versions:
- v1.0 : supports AngularJS 1.1.5 and below.
- v2.0 : supports AngularJS 1.2 +
- v3.0 / Master Branch : supports AngularJS 1.2 +, Angular UI Bootstrap 0.10.0
Predefined dialogs/modals include:
- $dialogs.error(header,msg)
- $dialogs.wait(header,msg,progess)
- $dialogs.notify(header,msg)
- $dialogs.confirm(header,msg)
- $dialogs.create(url,ctrlr,data,opts)
Dependencies:
v1.0
- Angular JS - www.angularjs.org (version 1.1.5 and less)
- Angular UI Bootstrap - http://angular-ui.github.io/bootstrap/#/modal (version <= 0.6.0, Non-Bootstrap 3 Branch) with embedded templates.
- Twitter Bootstrap CSS (2+)
v2.0 Additional Dependencies
- Angular JS ngSanitize - http://code.angularjs.org/1.2.1/angular-sanitize.min.js
- ngSanitize: http://docs.angularjs.org/api/ngSanitize (needed for ng-bind-html)
v3.0
- AngularJS 1.2 +
- Angular UI Bootstrap 0.10.0
- Twitter Bootstrap CSS 3.0.3
- AngularJS ngSanitize
CSS:
Included a css file that has a .modal class fix for Bootstrap and also has some predefined styles for the various modals described in the service.
v3.0 css file has the .modal class removed that had been a fix for a Bootstrap 3 display problem. This has since been rectified by Angular UI and Bootstrap.
Changes:
v3.0
- Added support for Angular UI Bootstrap 0.10.0.
- Added the ability to customize the header on the error and wait dialogs.
- Added example files.
Notes:
- Bootstrap 3: (v3.0 of this service no longer requires this fix) There's a problem with the actual modal being displayed even though it appears in the HTML code to be present. I found that adding a "display: block" to Bootstrap 3's .modal class solved the problem.
- It should not rely on including the Bootstrap JS.
- For version 2.0 + of this service module do not forget to include the ngSanitize Angular module.