chore(material): clean up old workarounds with new features.

modules/angular2_material/src/components/dialog/dialog.ts

@@ -16,7 +16,7 @@ import {ObservableWrapper, Promise, PromiseWrapper} from 'angular2/src/facade/as
 import {isPresent, Type} from 'angular2/src/facade/lang';
 import {DOM} from 'angular2/src/dom/dom_adapter';
 import {MouseEvent, KeyboardEvent} from 'angular2/src/facade/browser';
-import {KEY_ESC} from 'angular2_material/src/core/constants';
+import {KeyCodes} from 'angular2_material/src/core/key_codes';
 
 // TODO(jelbourn): Opener of dialog can control where it is rendered.
 // TODO(jelbourn): body scrolling is disabled while dialog is open.
@@ -44,7 +44,6 @@ export class MdDialog {
    * Opens a modal dialog.
    * @param type The component to open.
    * @param elementRef The logical location into which the component will be opened.
-   * @param parentInjector
    * @param options
    * @returns Promise for a reference to the dialog.
    */
@@ -69,11 +68,6 @@ export class MdDialog {
           var dialogElement = containerRef.location.nativeElement;
           DOM.appendChild(DOM.query('body'), dialogElement);
 
-          // TODO(jelbourn): Use hostProperties binding to set these once #1539 is fixed.
-          // Configure properties on the host element.
-          DOM.addClass(dialogElement, 'md-dialog');
-          DOM.setAttribute(dialogElement, 'tabindex', '0');
-
           // TODO(jelbourn): Do this with hostProperties (or another rendering abstraction) once
           // ready.
           if (isPresent(config.width)) {
@@ -119,11 +113,11 @@ export class MdDialog {
   }
 
   alert(message: string, okMessage: string): Promise<any> {
-    throw "Not implemented";
+    throw 'Not implemented';
   }
 
   confirm(message: string, okMessage: string, cancelMessage: string): Promise<any> {
-    throw "Not implemented";
+    throw 'Not implemented';
   }
 }
 
@@ -209,9 +203,14 @@ export class MdDialogConfig {
  */
 @Component({
   selector: 'md-dialog-container',
-  host: {'(body:^keydown)': 'documentKeypress($event)'},
+  host: {
+    'class': 'md-dialog',
+    'tabindex': '0',
+    '(body:^keydown)': 'documentKeypress($event)',
+  },
 })
 @View({
+  encapsulation: ViewEncapsulation.NONE,
   templateUrl: 'package:angular2_material/src/components/dialog/dialog.html',
   directives: [forwardRef(() => MdDialogContent)]
 })
@@ -232,7 +231,7 @@ class MdDialogContainer {
   }
 
   documentKeypress(event: KeyboardEvent) {
-    if (event.keyCode == KEY_ESC) {
+    if (event.keyCode == KeyCodes.ESCAPE) {
       this.dialogRef.close();
     }
   }
@@ -243,7 +242,9 @@ class MdDialogContainer {
  * location
  * for where the dialog content will be loaded.
  */
-@Directive({selector: 'md-dialog-content'})
+@Directive({
+  selector: 'md-dialog-content',
+})
 class MdDialogContent {
   constructor(@Host() @SkipSelf() dialogContainer: MdDialogContainer, elementRef: ElementRef) {
     dialogContainer.contentRef = elementRef;
@@ -253,9 +254,11 @@ class MdDialogContent {
 /** Component for the dialog "backdrop", a transparent overlay over the rest of the page. */
 @Component({
   selector: 'md-backdrop',
-  host: {'(click)': 'onClick()'},
+  host: {
+    '(click)': 'onClick()',
+  },
 })
-@View({template: ''})
+@View({template: '', encapsulation: ViewEncapsulation.NONE})
 class MdBackdrop {
   dialogRef: MdDialogRef;