Dialogs
![Screen_Shot_2015-04-17_at_7.27.28_PM_c91f105bb90219228b155fda15b4f1ff9ce58f35_410x202.png 410](https://files.readme.io/AozZ7FIQ0WpClvBs37D2_Screen_Shot_2015-04-17_at_7.27.28_PM_c91f105bb90219228b155fda15b4f1ff9ce58f35_410x202.png)
Dialogs are a component of Angular Material.
This repository gives you a layer of abstraction on top of Angular Material's dialog service.
The custom DialogService
allows you to easily open an alert and a confirm using pre-defined defaults that you can modify in angular/services/dialog.service.js
.
(function() {
"use strict";
angular.module('app.controllers').controller('LandingController', LandingController);
function LandingController(DialogService) {
var vm = this;
vm.confirmMessage = '';
vm.sampleAlert = sampleAlert;
vm.sampleConfirm = sampleConfim;
var sampleAlert = function() {
DialogService.alert('This is an alert title', 'You can specify some description text in here.');
};
var sampleConfirm = function() {
DialogService.confirm('This is a confirm title', 'Are you sure you want to do delete this file?').then(function() {
vm.confirmMessage = 'Success callback';
}, function() {
vm.confirmMessage = 'Cancel callback';
}
);
};
});
})();
Custom Dialogs
Another useful feature is the ability to easily call custom dialogs using a folder by feature approach.
Let's start by generating a custom dialog:
php artisan ng:dialog login
This will create a login folder in angular/dialogs
with a sample controller and template.
You can then open this dialog easily using the following sample code:
(function() {
"use strict";
angular.module('app.controllers').controller('LoginController', LoginController);
function LoginController(DialogService) {
var vm = this;
vm.customDialog = customDialog;
var customDialog = function() {
DialogService.fromTemplate('login');
};
});
})();
This example works out of the box.
Elixir, live-reload, DialogService & Artisan generators all work in harmony to achieve this.
Updated less than a minute ago