2017-04-18 144 views
1

請與我和我的問題裸露,我很新的角度,打字稿及離子2,但不Socket.io,基本上我把聊天的例子中,並嘗試在我的應用程序通過Socket.io從顯示其他的東西服務器,但我無法弄清楚這個問題,我會試着解釋作爲最好的,我可以在服務器端部分我想一個簡單的整數值推到我的客戶端應用程序:什麼是從服務器顯示值的正確方法?

var socket = require('socket.io'), 
    http = require('http'), 
    server = http.createServer(), 
    socket = socket.listen(server); 
    var msgProva = 2; 

socket.on('connection', function(connection) { 
    console.log('User Connected'); 
    socket.emit('prova', msgProva); //2 


    connection.on('message', function(msg){ 
     socket.emit('message', msg); 
    }); 

}); 

server.listen(3000, function(){ 
    console.log('Server started'); 
}); 

正如你所看到的,我試圖推出一個簡單的「2」。

這是我home.ts:

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

import { NavController } from 'ionic-angular'; 
import * as io from 'socket.io-client'; 


@Component({ 
    selector: 'page-home', 
    templateUrl: 'home.html' 
}) 
export class HomePage { 
    socket:any 
    chat_input:string; 
    chats = []; 
    prova; 


    constructor(public navCtrl: NavController) { 
     this.socket = io('http://localhost:3000'); 

    this.socket.on('message', (msg) => { 
    console.log("message", msg); 
    this.chats.push(msg); 
    }); 

    this.socket.on('prova', (msgProva) => { 
     console.log("msgProva", msgProva); 
     this.prova.push(msgProva); 
    }); 
    } 

    send(msg) { 
     if(msg != ''){ 
      this.socket.emit('message', msg); 
     } 
     this.chat_input = ''; 
    } 
} 

所以我很期待,關於 「PROVA」 事件中,我recive我的 「2」 的服務器。

,這是我的Home.html:

<ion-content padding> 
    <ion-item> 
    <ion-icon name="logo-twitter" item-left></ion-icon> 
    Followers 
    <ion-badge color="secondary">{{prova}}</ion-badge> 
    </ion-item> 

    <ion-list> 
     <ion-item *ngFor="let message of chats">{{message}}</ion-item> 
    </ion-list> 

    <ion-item> 
     <ion-input type="text" [(ngModel)]="chat_input" placeholder="Enter message"></ion-input> 
    </ion-item> 

    <button ion-button block (click)="send(chat_input)">Send</button> 
</ion-content> 

但到目前爲止,我沒有看到問題的所在,所以請耐心等待我的含糊不清的問題,因爲我不知道到底問題出在哪裏,任何人都可以指出我或解釋我明顯做錯了什麼?

回答

1

您的問題可能是provaundefined,但你正在試圖推到它。

export class HomePage { 
    socket:any 
    chat_input:string; 
    chats = []; 
    prova = []; // set to an array 
+0

我想我已經嘗試that..I'm想,我的問題是在HTML文件中,它打印的價值「2」也是在{{消息}} – FabioEnne

+0

在HTML文件中,你試圖回聲'prova'並通過'聊天'循環。在你的TS文件中,你試圖把一個值push到this.prova和this.chats上。 至於我可以告訴大家,在看到「2」'message'是正確的,因爲你已經推到數組,你遍歷它。 – TheBrockEllis

+0

@SteamDev好了,對不起,我的重播延遲,你是對的,我沒有initialiazed PROVA作爲一個數組,我雖然是可能的推號,但顯然this.prova.push只能推陣列..有一種只傳遞一個變量而不是數組的方法? – FabioEnne

相關問題