title: No provider for MatDialogRef
body: <p>I am using material 2 version 2.0.0-beta.12. I need to adjust the position of the material Modal. I followed this answer to do that. <a href="https://stackoverflow.com/a/44238699/8253445">https://stackoverflow.com/a/44238699/8253445</a> Since <code>MdDialog</code> is not available now I used <code>{MatDialog, MatDialogRef, MAT_DIALOG_DATA}</code>.</p>
  <pre class="lang-js prettyprint-override"><code>constructor(public dialog: MatDialog,public dialModRef:MatDialogRef&lt;any&gt;) {}
  </code></pre>
  <p>When I add MatDialogRef to my constructor it gives me the error:</p>
  <blockquote>
  <p>No provider for MatDialogRef</p>
  </blockquote>
  <h2>dialog-overview-example.ts</h2>
  <pre class="lang-js prettyprint-override"><code>import {Component, Inject} from '@angular/core';
  import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from
  '@angular/material';
  
  @Component({
      selector: 'dialog-overview-example',
      templateUrl: 'dialog-overview-example.html'
  })
  export class DialogOverviewExample {
  
      animal: string;
      name: string;
  
      constructor(public dialog: MatDialog,public
      dialModRef:MatDialogRef&lt;any&gt;) {}
  
      openDialog(): void {
          let dialogRef = this.dialog.open(DialogOverviewExampleDialog, {
          width: '500px',
          data: { name: this.name, animal: this.animal }
      });
  
      dialogRef.afterClosed().subscribe(result =&gt; {
          console.log('The dialog was closed');
          this.animal = result;
      });
      }
  }
  
  @Component({
      selector: 'dialog-overview-example-dialog',
      templateUrl: 'dialog-overview-example-dialog.html',
  })
  export class DialogOverviewExampleDialog {
  
  constructor(
      public dialogRef: MatDialogRef&lt;DialogOverviewExampleDialog&gt;,
  @Inject(MAT_DIALOG_DATA) public data: any) { }
  
      onNoClick(): void {
      this.dialogRef.close();
      }
  }
  </code></pre>
  <h2>app.module.ts</h2>
  <pre class="lang-js prettyprint-override"><code>entryComponents: [DialogOverviewExample,DialogOverviewExampleDialog]
  </code></pre>
  <h2>dialog-overview-example-dialog.html</h2>
  <pre class="lang-html prettyprint-override"><code>&lt;h1 md-dialog-title&gt;Hi {{data.name}}&lt;/h1&gt;
  &lt;div md-dialog-content&gt;
      &lt;p&gt;What's your favorite animal?&lt;/p&gt;
      &lt;md-form-field&gt;
      &lt;input mdInput tabindex=&quot;1&quot; [(ngModel)]=&quot;data.animal&quot;&gt;
      &lt;/md-form-field&gt;
  &lt;/div&gt;
  &lt;div md-dialog-actions&gt;
      &lt;button md-button tabindex=&quot;2&quot;&gt;Ok&lt;/button&gt;
      &lt;button md-button (click)=&quot;onNoClick()&quot; tabindex=&quot;-1&quot;&gt;No Thanks&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>