diff --git a/src/lib/dialog/dialog-content-directives.ts b/src/lib/dialog/dialog-content-directives.ts index aa3575197f0e..bfeaf596f6f7 100644 --- a/src/lib/dialog/dialog-content-directives.ts +++ b/src/lib/dialog/dialog-content-directives.ts @@ -8,7 +8,7 @@ import {MdDialogRef} from './dialog-ref'; @Directive({ selector: 'button[md-dialog-close], button[mat-dialog-close]', host: { - '(click)': 'dialogRef.close()', + '(click)': 'dialogRef.close(dialogResult)', '[attr.aria-label]': 'ariaLabel', 'type': 'button', // Prevents accidental form submits. } @@ -17,6 +17,12 @@ export class MdDialogClose { /** Screenreader label for the button. */ @Input('aria-label') ariaLabel: string = 'Close dialog'; + /** Dialog close input. */ + @Input('md-dialog-close') dialogResult: any; + + /** Dialog close input for compatibility mode. */ + @Input('mat-dialog-close') set _matDialogClose(value: any) { this.dialogResult = value; } + constructor(public dialogRef: MdDialogRef) { } } diff --git a/src/lib/dialog/dialog.md b/src/lib/dialog/dialog.md index 70272dd6aae0..288f6d00a2b2 100644 --- a/src/lib/dialog/dialog.md +++ b/src/lib/dialog/dialog.md @@ -56,12 +56,23 @@ export class YourDialog { ### Dialog content Several directives are available to make it easier to structure your dialog content: -| Name | Description | -|-----------------------|--------------------------------------------------------------------------| -| `md-dialog-title` | \[Attr] Dialog title, applied to a heading element (e.g., `

`, `

`)| -| `` | Primary scrollable content of the dialog | -| `` | Container for action buttons at the bottom of the dialog | -| `md-dialog-close` | \[Attr] Added to a ` + + + +``` Once a dialog opens, the dialog will automatically focus the first tabbable element. diff --git a/src/lib/dialog/dialog.spec.ts b/src/lib/dialog/dialog.spec.ts index a880bcb1344b..d4bbc64cf0a0 100644 --- a/src/lib/dialog/dialog.spec.ts +++ b/src/lib/dialog/dialog.spec.ts @@ -600,6 +600,18 @@ describe('MdDialog', () => { expect(button.getAttribute('type')).toBe('button'); }); + it('should return the [md-dialog-close] result when clicking on the close button', async(() => { + let afterCloseCallback = jasmine.createSpy('afterClose callback'); + dialogRef.afterClosed().subscribe(afterCloseCallback); + + (overlayContainerElement.querySelector('button.close-with-true') as HTMLElement).click(); + viewContainerFixture.detectChanges(); + + viewContainerFixture.whenStable().then(() => { + expect(afterCloseCallback).toHaveBeenCalledWith(true); + }); + })); + }); }); @@ -714,6 +726,7 @@ class PizzaMsg { Lorem ipsum dolor sit amet. +
Should not close
` diff --git a/src/material-examples/dialog-result/dialog-result-example-dialog.html b/src/material-examples/dialog-result/dialog-result-example-dialog.html index 0e4dd6339a94..50d5982b8398 100644 --- a/src/material-examples/dialog-result/dialog-result-example-dialog.html +++ b/src/material-examples/dialog-result/dialog-result-example-dialog.html @@ -1,6 +1,6 @@

Dialog

What would you like to do?
- - + +