Question

我目前有一个非常奇怪的错误，我无法解决。我有一个SocketIoService处理我的socket.io websocket。

SocketIoService

import { Injectable } from '@angular/core';

import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';
import 'rxjs/add/operator/map';
import { Socket } from 'ng-socket-io';


@Injectable()
export class SocketioService {

    getRecentMessages(){
        this.socket.emit('messages');
        return this.socket
        .fromEvent("messages")
        .map( data => data );
    }


    constructor(private socket:Socket) {
        console.log('[i] socketio service connected');
    }

}

我从ChatComponent

订阅了observable getRecentMessages（）

Chat.Component.ts

import { Component, OnInit } from '@angular/core';
import { SocketioService } from '../../services/socketio.service';

@Component({
    selector: 'app-chat',
    templateUrl: './chat.component.html',
    styleUrls: ['./chat.component.css']
})
export class ChatComponent implements OnInit {

    messages:Object[] = [];

    constructor(
        private socketioService:SocketioService
    ) {}

    ngOnInit() {
        this.socketioService.getRecentMessages().subscribe(messages => {
            console.log('SOCKET received chat/messages DATA', messages);
            this.messages = messages;
        });
    }


}

初始化Chat.Component.ts时，它订阅了getRecentMessages（）。然后该函数发送到我的后端服务器，服务器响应最新消息的数组。看起来像这样： https://gyazo.com/ecedc406fec48a4e1224ae2aa47844d0

我尝试将messages数组设置为等于Chat.Component.ts中的响应，但我得到错误类型'{}'不能分配给'Object []'。这意味着Angular / Typescript会以某种方式认为响应是一个对象而不是一个数组。我该如何解决？谢谢:)）

Answer 1

只需更改

这

  messages:Object[] = [];

要

  messages:any = [];

Answer 2

如果getRecentMessages()返回一个字符串数组，则应将observable转换为数组，例如

this.socketioService.getRecentMessages()<string[]>.subscribe(...)

Answer 3

试试这样：

messages:Object[] = [];

insted of

private messages: Array<any> = [];

Answer 4

尝试为对象模型创建界面，例如：

export interface Message {
    _id: string,
    updated_at: Date,
    created_at: Date,
    ...
}

然后导入到组件中，并将变量初始化为Message对象的数组：

messages: Message[];

Answer 5

FIXED：最后我找到了解决方案..我查看了用于处理socket.io的模块ng-socket-io。这个功能

https://gyazo.com/43a45d65ba56997f4ea401653cb75416

可以为observable提供一个类型参数。在我的socketio.service中，我将它添加到.fromEvent：

之后

getRecentMessages(){
    this.socket.emit('messages');
    return this.socket
    .fromEvent<Object[]>("messages")
    .map( data => data );
}

现在完美运作。感谢所有回答我问题的人！

Angular 2/4 |类型“{}”不能分配给“对象[]”类型

5 个答案: