ngEasyModal
A simple directive/delegator for show, get and hide modals. Demo Page
$ npm install ng-easy-modal --save
Usage
Load ng-easy-modal.js library in your index.html file and inject ngEasyModal module inside your angular module
angular
Inject EasyModalDelegate inside your controller/service/directive and connect with your scope ($scope or this);
;
Create a new Object for set all EasyModal params
;
Insert inside your .html file:
Show my classic modal
Style
Insert ng-easy-modal.css in the <header> of your .html file
Your Title ... ...
CSS classes inside easy-modal directive:
Animation
First include angular-animate.js and ng-easy-modal.css in your HTML:
Then load the module in your application by adding it as a dependent module:
angular
Including ngAnimate and ng-easy-modal.css the animation hooks are enabled for ngEasyModal.
API
- EasyModalDelegate.show(object)
- EasyModalDelegate.close()
- EasyModalDelegate.status(value)
- EasyModalDelegate.get(value);
- [reset-template]
show(object)
// Set your modalvar myModal = status: 'yourStatusOrID' title: 'Modal title' body: 'Modal paragraph' buttons: label: 'Button one' { ; } label: 'Button two' { ; } clickOut: false templateUrl: 'folder/file.html'; // Show your modalEasyModalDelegate
close()
Close the current modal
EasyModalDelegate
status(value)
Return true/modalObject if we show a modal with the same status/id
get(value)
Return value from the current modal
EasyModalDelegate;EasyModalDelegate;EasyModalDelegate;EasyModalDelegate;EasyModalDelegate;EasyModalDelegate;
[reset-template]
Reset modal template, use it with transclude method
My new title My new content CLick me!