title: User notification service with rxjs in Angular?
body: <p>I'm relatively new to reactive programming and I'm trying to create an Angular service which can display notifications to the user. So far this is what I have: </p>
  
  <p><a href="https://stackblitz.com/edit/angular-rxjs-notifications?file=app%2Fapp.component.html" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-rxjs-notifications?file=app%2Fapp.component.html</a></p>
  
  <p>But there is a major problem with my implementation that I don't know how to solve: How, in a <em>reactive</em> way, can I queue up notifications? I would like my notification <code>div</code> to appear when the first notification is pushed and when the user clicks "Clear" I would like the div to disappear unless other notifications have been pushed since. That way clear would show the next notification and so on until all notifications have been cleared. Then as soon as a new notification is pushed the div should pop up again.</p>
  
  <p>I chose a <code>Subject</code> in my implementation over a <code>ReplaySubject</code> because I don't want users to see notifications that were pushed while they were loading the next screen but I realized that if I'm using a router inside my <code>app.component.html</code> then I'll run into that behavior anyways. Maybe I need to clear the notification queue when a routing occurs?</p>
  
  <p>Thanks in advance!</p>