如何在角度6中捕获第三方库中的数据？

Question

I've been banging my head trying to solve an issue regarding this problem of capturing data from a 3rd party library.

Library used is Pushfyi: https://docs.pushfyi.com/

room.component.ts:

1| messages = [];
2| 
3| pushfyi.publish('test', { message : message });
4|
5| pushfyi.subscribe('test', function(evnt){
6|  let json = JSON.parse(evnt);
7|  this.messages.push(json.message);
8|});

After running the code it gives me an error message: ERROR TypeError: Cannot read property 'push' of undefined

I understand that this.messages does not exist inside the function, so how can I capture the json.message to have it show on my room.component.html in my view

---

UPDATE: Here is the complete room.component.ts and on line 32 is where I get the error: ERROR TypeError: Cannot read property 'push' of undefined

  1 import { Component, OnInit, NgZone, ChangeDetectorRef} from '@angular/core';
  2 import { Router, ActivatedRoute, ParamMap } from '@angular/router';
  3 import { PushfyiService } from './../pushfyi.service';
  4     
  5 @Component({
  6   selector: 'app-room',                                                        
  7   templateUrl: './room.component.html',                                        
  8   styleUrls: ['./room.component.css']
  9 })
 10 export class RoomComponent implements OnInit {                                 
 11 
 12   roomId = '';
 13   messages = ["test"];
 14 
 15   constructor(private route: ActivatedRoute, private ref: ChangeDetectorRef, private pushfyiService: PushfyiService) { }
 16 
 17   ngOnInit() {
 18     this.route.paramMap.subscribe((params: ParamMap) => {
 19       this.roomId = params.get('id');  
 20 
 21       this.pushfyiService.init(this.roomId);
 22     });
 23   }
 24 
 25   sendChange(value){
 26     this.pushfyiService.publish('pushfyi-component', value);
 27     this.pushfyiService.pushfyi.subscribe('pushfyi-component', this.setMessage);
 28   }
 29 
 30   setMessage(evnt){
 31     let json = JSON.parse(evnt);
 32     this.messages.push(json.data);
 33   }
 34 
 35 }

Answer 1

You're not binding your event callback to the local scope, that's why your callback does not know the messages array :

5| pushfyi.subscribe('test', function(evnt){
6|  let json = JSON.parse(evnt);
7|  this.messages.push(json.message);
8|});

should be

5| pushfyi.subscribe('test', evnt => {
6|  let json = JSON.parse(evnt);
7|  this.messages.push(json.message);
8|});