$mdDialog opens a dialog over the app to inform users about critical information or require
them to make decisions. There are two approaches for setup: a simple promise API
and regular object syntax.
<md-dialog> element.
Inside, use an <md-dialog-content> element for the dialog's content, and use
an <md-dialog-actions> element for the dialog's actions.parent option to change where dialogs are appended.flex="percentage", i.e. flex="66".rootElement or parent..md-dialog-content - class that sets the padding on the content as the spec fileNumber {{item}}
' + ' '+ 'Using the multiple option for the $mdDialog service allows developers to show multiple dialogs
at the same time.
By using the contentElement option, it is possible to use an already existing element in the DOM.
Pre-rendered dialogs will be not linked to any scope and will not instantiate any new controller.
You can manually link the elements to a scope or instantiate a controller from the template (ng-controller)
When using a string as value, $mdDialog will automatically query the DOM for the specified CSS selector.
Notice: It is important, to use the .md-dialog-container as the content element, otherwise the dialog
will not show up.
It also possible to use a DOM element for the contentElement option.
contentElement: document.querySelector('#myStaticDialog')contentElement: angular.element(TEMPLATE)When using a template as content element, it will be not compiled upon open.
This allows you to compile the element yourself and use it each time the dialog opens.
Developers are also able to create their own preset, which can be easily used without repeating their options each time.
After you created your preset at config phase, you can easily access it.
locals options...
$scope.employee = employee;
$scope.closeDialog = function() {
// Easily hides most recent dialog shown...
// no specific instance reference is needed.
$mdDialog.hide();
};
}
})(angular);
$mdDialog.alert();
Builds a preconfigured dialog with the specified message.
| Returns | Description |
|---|---|
obj |
an
|
$mdDialog.confirm();
Builds a preconfigured dialog with the specified message. You can call show and the promise returned will be resolved only if the user clicks the confirm action on the dialog.
| Returns | Description |
|---|---|
obj |
an Additionally, it supports the following methods:
|
$mdDialog.prompt();
Builds a preconfigured dialog with the specified message and input box. You can call show and the promise returned will be resolved only if the user clicks the prompt action on the dialog, passing the input value as the first argument.
| Returns | Description |
|---|---|
obj |
an Additionally, it supports the following methods:
|
$mdDialog.show(optionsOrPreset);
Show a dialog with the specified options.
| Parameter | Type | Description |
|---|---|---|
* optionsOrPreset
object
|
object |
Either provide an
|
| Returns | Description |
|---|---|
promise |
A promise that can be resolved with |
$mdDialog.hide([response]);
Hide an existing dialog and resolve the promise returned from $mdDialog.show().
| Parameter | Type | Description |
|---|---|---|
response
*
|
* |
An argument for the resolved promise. |
| Returns | Description |
|---|---|
promise |
A promise that is resolved when the dialog has been closed. |
$mdDialog.cancel([response]);
Hide an existing dialog and reject the promise returned from $mdDialog.show().
| Parameter | Type | Description |
|---|---|---|
response
*
|
* |
An argument for the rejected promise. |
| Returns | Description |
|---|---|
promise |
A promise that is resolved when the dialog has been closed. |