Question

我正在学习如何为我的推送器通知实现通知服务。我基本上想要跟踪来自推送器的通知。目前，我能够从推送通道接收推送通知，但是在我点击之后它会消失/销毁。事实上，我想在列表中显示pusher在我的应用程序中触发的通知，以便我可以跟踪它们。通知应该列在event.html页面上。 问题：通知服务如何使用推送器功能来实现我上面解释的内容？

通知服务

export class NotificationService {
  private _notifications = new Subject<Notification>();

  public noteAdded = this._notifications.asObservable();

  public add(notification: Notification) {
      this._notifications.next(notification);
}

通知模型

export class Notification{
    constructor(
        public type: string = '',
        public message: string = '') {}
}

通知

 @Component({
    selector: 'notifications',
    template:`
    <div class="notifications">
        <div (click)="hide(note)" class="{{ note.type }}"
                *ngFor="let note of _notes">
            {{ note.message }}
        </div>
    </div>
    `,
    providers:[NotificationService]
})

export class NotificationComponent{
    private _notes: Notification[];

    constructor(private _notifications: NotificationService) {
        this._notes = new Array<Notification>();

        _notifications.noteAdded.subscribe(note => {
            this._notes.push(note);
            setTimeout(() => { this.hide.bind(this)(note) }, 3000);
        });
    }

    private hide(note) {
        let index = this._notes.indexOf(note);

        if (index >= 0) {
            this._notes.splice(index, 1);
        }
    }
}

event.html

 <notifications></notifications>

event.ts

@Component({
    selector: 'pusher',
    templateUrl: 'event.html',
    providers:[HttpService, NotificationService]
})
export class pusherComponent{
    constructor(private httpService:HttpService, private router:Router, private elementRef:ElementRef, private _notes:NotificationService) {}

    ngAfterViewInit(){
        var s = document.createElement("script");
        s.type = "text/javascript";
        s.src ="src/app/js/pusher.js";
        this.elementRef.nativeElement.appendChild(s);
    }
 }

Answer 1

这可能就是你要找的东西 Simple Notification Stack

Angular 2中Pusher的通知服务

1 个答案: