fix(dialog): directionality not injected into child components

Since the `direction` option from the overlay only sets the `dir` attribute, it means that any components that depend on the `Directionality` service (e.g. `md-slider`) won't be able to pick it up. These changes add the proper direction to the custom dialog injector.

Author: crisbeto

src/lib/dialog/dialog.spec.ts

@@ -22,6 +22,7 @@ import {By} from '@angular/platform-browser';
 import {NoopAnimationsModule} from '@angular/platform-browser/animations';
 import {Location} from '@angular/common';
 import {SpyLocation} from '@angular/common/testing';
+import {Directionality} from '@angular/cdk/bidi';
 import {MatDialogContainer} from './dialog-container';
 import {OverlayContainer} from '@angular/cdk/overlay';
 import {ESCAPE} from '@angular/cdk/keycodes';
@@ -433,6 +434,14 @@ describe('MatDialog', () => {
     expect(overlayPane.getAttribute('dir')).toBe('rtl');
   });
 
+  it('should inject the correct layout direction in the component instance', () => {
+    const dialogRef = dialog.open(PizzaMsg, { direction: 'rtl' });
+
+    viewContainerFixture.detectChanges();
+
+    expect(dialogRef.componentInstance.directionality.value).toBe('rtl');
+  });
+
   it('should close all of the dialogs', async(() => {
     dialog.open(PizzaMsg);
     dialog.open(PizzaMsg);
@@ -970,7 +979,8 @@ class ComponentWithTemplateRef {
 @Component({template: '<p>Pizza</p> <input> <button>Close</button>'})
 class PizzaMsg {
   constructor(public dialogRef: MatDialogRef<PizzaMsg>,
-              public dialogInjector: Injector) {}
+              public dialogInjector: Injector,
+              public directionality: Directionality) {}
 }
 
 @Component({

src/lib/dialog/dialog.ts

@@ -28,12 +28,14 @@ import {
   TemplateRef,
 } from '@angular/core';
 import {extendObject} from '@angular/material/core';
+import {Directionality} from '@angular/cdk/bidi';
 import {Observable} from 'rxjs/Observable';
 import {defer} from 'rxjs/observable/defer';
 import {Subject} from 'rxjs/Subject';
 import {MatDialogConfig} from './dialog-config';
 import {MatDialogContainer} from './dialog-container';
 import {MatDialogRef} from './dialog-ref';
+import {of as observableOf} from 'rxjs/observable/of';
 
 
 export const MAT_DIALOG_DATA = new InjectionToken<any>('MatDialogData');
@@ -277,6 +279,10 @@ export class MatDialog {
     injectionTokens.set(MatDialogRef, dialogRef);
     injectionTokens.set(MatDialogContainer, dialogContainer);
     injectionTokens.set(MAT_DIALOG_DATA, config.data);
+    injectionTokens.set(Directionality, {
+      value: config.direction,
+      change: observableOf()
+    });
 
     return new PortalInjector(userInjector || this._injector, injectionTokens);
   }