[英]Cannot read property 'push' of undefined Typescript / Angular 6
I'm Implementing small chat application using socket.io gladly it's working fine. 我正在使用socket.io实现小型聊天应用程序,它运行良好。 But my concern is when I got a new chat I need to assign it to string array to display in listview.
但是我担心的是,当我进行新的聊天时,我需要将其分配给字符串数组以显示在列表视图中。
I have simply define array as "messages: string[] = [];" 我只是简单地将数组定义为“消息:string [] = [];” and pushed sample string on page load and it's working fine.But when I got new message from a socket this.socket.on('newmessage', function (data) method will fire and can read new message.those all things working correctly.
并在页面加载时推送示例字符串,它工作正常。但是当我从套接字收到新消息时, this.socket.on('newmessage',function(data) method将触发并可以读取新消息 。所有这些都正常工作。
But When I push new string into my "messages: string[] = [];" 但是,当我将新字符串放入“消息:string [] = [];”时 array.
阵列。 I'm getting 'Cannot read property 'push' of undefined' error.
我收到“无法读取未定义的属性“推””错误。
import { Component, OnInit} from '@angular/core'; import * as io from 'socket.io-client'; @Component({ selector: 'app-chatbox', templateUrl: './chatbox.component.html', styleUrls: ['./chatbox.component.css'], }) export class ChatboxComponent implements OnInit { socket; messages: string[] = []; constructor() { this.socket = io.connect('http://localhost:8000'); } ngOnInit() { this.initializeChatServer(); } initializeChatServer() { this.messages.push( 'test 55');//This line works this.socket.on('newmessage', function (data) { console.log('message -> ' + data.nick + '>' + data.msg); this.messages.push(data.msg); //Cannot read property 'push' of undefined }); } }
this.messages.push(data.msg);
this.messages.push(data.msg); //Cannot read property 'push' of undefined
//无法读取未定义的属性“ push”
Because you have the wrong this
. 因为你错了
this
。 Arrow functions will fix that eg Change this.socket.on('newmessage', function (data) {
to this.socket.on('newmessage', (data) => {
箭头函数可以解决该问题,例如,将
this.socket.on('newmessage', function (data) {
更改为this.socket.on('newmessage', (data) => {
import { Component, OnInit} from '@angular/core';
import * as io from 'socket.io-client';
@Component({
selector: 'app-chatbox',
templateUrl: './chatbox.component.html',
styleUrls: ['./chatbox.component.css'],
})
export class ChatboxComponent implements OnInit {
socket;
messages: string[] = [];
constructor() { this.socket = io.connect('http://localhost:8000'); }
ngOnInit() {
this.initializeChatServer();
}
initializeChatServer() {
this.messages.push( 'test 55');//This line works
this.socket.on('newmessage', data => {
console.log('message -> ' + data.nick + '>' + data.msg);
this.messages.push(data.msg); //Cannot read property 'push' of undefined
});
}
}
I think it's because of synchronize call.I think it's not the standard way but it worked after I change like this.. 我认为这是因为同步调用。我认为这不是标准方法,但是在我进行了这样的更改后它才起作用。
initializeChatServer() { this.messages.push( 'test 55'); var self = this;//assgin this to var variable this.socket.on('newmessage', data => { console.log('message -> ' + data.nick + '>' + data.msg); self.messages.push(data.msg); }); }
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.