Angular 2 Better Message Service

我有一個MessageService類，它有一個setMessage方法觸發一個事件，還有一個MainComponent類，它是監聽這個事件的所有組件的父組件。所以事件將會發生火災，MainComponent會抓住它並且一切正常。但有一個問題。當用戶更改組件時，例如：從儀表板組件導航到用戶組件時，消息自動銷燬。但這裏不會發生這種情況，消息仍然會顯示給用戶。我寫了一個計時器的時間後刪除留言，但我想知道是否有實現這個還是不Angular 2 Better Message Service

這是我的信息服務類更好的辦法：

import {ReplaySubject} from 'rxjs/ReplaySubject'; 

export class MessageService{ 

public messageSource; 
public messageEvent; 


constructor(){ 
    this.messageSource = new ReplaySubject(1); 
    this.messageEvent = this.messageSource.asObservable(); 
} 


public setMessage(message){ 
    this.messageSource.next(message); 
    window.setTimeout(()=>{ 
     this.destruct(); 
    },5000); 
} 

public destruct(){ 
    this.messageSource.next(null); 
}

，這是我的主要組件類：

export class MainComponent extends BaseComponent{ 


constructor(public router:Router,public authService:AuthService,public messageService:MessageService){ 
    super(router); 
    this.messageService.messageEvent.subscribe(msg => { 
     this.message = msg; 
    }); 

} 



public logout(){ 
    this.authService.removeToken(); 
    this.permission.user = null; 
    this.router.navigate(['/']); 
} 

}

來源

2016-11-24 hossein ahmadi

你shoudl切換您的打字稿 – Walfrat

JavaScript代碼，你可以給更多的細節？ –

在組件的ngOnDestroy生命週期鉤子中觸發移除消息。它會在組件被銷燬時觸發。

@Component({selector: 'my-cmp', template: `...`}) 
class MyComponent implements OnDestroy { 
    ngOnDestroy() { 
    // your code will go here 
    } 
}

來源

2016-11-24 15:00:23

我試過這個，但是我說的主要組件是父組件，所以ngDestroy不會調用它。所以通過這種方式，我必須在所有組件中調用這個函數，我認爲現在實現的方式比這更好。 –

Angular 2 Better Message Service

回答

相關問題