title: Angular Material destroy dialog instance
body: <p>Is there a proper way to destroy component instance which is created by dialog.
  When i close the dialog- component instance is not disposed:</p>
  
  <pre><code>import { Component, OnInit, Input, Output, EventEmitter, Inject } from '@angular/core';
  import { MdDialog, MdDialogRef, MD_DIALOG_DATA } from '@angular/material';
  
  @Component({
      selector: 'basket',
      templateUrl: './basket.component.html',
      styleUrls: ['./basket.component.css']
  })
  export class BasketComponent implements OnInit {
      @Input() Product: any;
  }
  
  @Component({
      selector: 'basket-dialog',
      template: '&lt;div&gt;&lt;basket [Product]="Product"&gt;&lt;/basket&gt;&lt;/div&gt;'
  })
  export class BasketDialogComponent implements OnInit {
      Product: any;
      constructor(public dialogRef: MdDialogRef&lt;BasketComponent&gt;,
          @Inject(MD_DIALOG_DATA) public productData: any) { }
  
  
      ngOnInit() {
          this.Product = this.productData;
          this.say();
      }
  
      say() {
          setTimeout(() =&gt; this.say(), 1000);
          console.log('test');
      }
  }
  </code></pre>
  
  <p>Create dialog:</p>
  
  <pre><code>let ordersDialog = this.dialog.open(BasketDialogComponent, {
      data: product
  });
  ordersDialog.afterClosed().subscribe(x =&gt; {
     // something like: orderDialog.componentInstance.dispose();
  });
  </code></pre>
  
  <p>The <code>say()</code> method is still being executed even after dialog is closed.</p>