角材破棄ダイアログインスタンス

Question

ダイアログで作成されたコンポーネントインスタンスを破棄する適切な方法はありますか？ iはdialog-コンポーネントインスタンスを近接して配置されていない。

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: '<div><basket [Product]="Product"></basket></div>' 
}) 
export class BasketDialogComponent implements OnInit { 
    Product: any; 
    constructor(public dialogRef: MdDialogRef<BasketComponent>, 
     @Inject(MD_DIALOG_DATA) public productData: any) { } 


    ngOnInit() { 
     this.Product = this.productData; 
     this.say(); 
    } 

    say() { 
     setTimeout(() => this.say(), 1000); 
     console.log('test'); 
    } 
} 

ダイアログの作成：

let ordersDialog = this.dialog.open(BasketDialogComponent, { 
    data: product 
}); 
ordersDialog.afterClosed().subscribe(x => { 
    // something like: orderDialog.componentInstance.dispose(); 
}); 

say()方法はまだダイアログを閉じた後でも実行されています。

Answer 1

あなたは自分をsetTimeoutを配置気にする必要がありますPlunker Example

Answer 2

export class BasketDialogComponent implements OnInit, OnDestroy { 

    timeoutId; 

    say() { 
    this.timeoutId = setTimeout(() => this.say(), 1000); 
    console.log('test'); 
    } 

    ngOnDestroy() { 
    if (this.timeoutId) { 
     clearTimeout(this.timeoutId); 
    } 
    } 
} 

私は近いこのような後に私のダイアログを配置します。開いたダイアログ参照をnullに設定するだけです。

let ordersDialog = this.dialog.open(BasketDialogComponent, { 
    data: product 
}); 
ordersDialog.afterClosed().subscribe(x => { 
    ordersDialog = null; 
});