Hi, i’m trying to build a chat app but clients only can talk with one user(that is the person of systems area), the system actually can send the messages and everything is okay, but there is just one thing. When i send a sessage, the other person has to go to the previous page(to update the current page data) and as every chat app it needs to update the messages in the same moment the message is sent. And i can’t update the page inside the page, because i need a variable(the ticket id) from the previous page(that is the list of messages page). Any idea of how to do it? This is my code:
MY HTML:
<ion-content padding>
<div class="message-wrap">
<h1 text-center style="font-size: 25px;">{{consulta}}</h1>
<div *ngFor="let mensaje of datosResp; let i=index" class="message">
<div [ngClass]="{educontable: estadoPositivo[i], cliente: !estadoPositivo[i]}">
<div class="msg-info">
<small >{{mensaje.nombre_usuario}} {{mensaje.fecha}}</small>
</div>
<div class="msg-content">
<p>{{mensaje.mensaje}}</p>
</div>
</div>
</div>
</div>
</ion-content>
<ion-footer no-border>
<div class="input-wrap">
<ion-textarea #chatinput placeholder="Escriba aqui..."
[(ngModel)]="editorMsg"
(focusin)="onFocus()"
scroll="true"
(keyup)="hideButton()"
id="input">
</ion-textarea>
<button ion-button clear icon-only item-right [disabled]="!isenabled" (click)="enviarMsj(chatinput.value)">
<ion-icon name="ios-send" ios="ios-send" md="md-send"></ion-icon>
</button>
</div>
MY TS:
constructor(public navCtrl: NavController,
public navParams: NavParams,
private _tp: TicketProvider,
private events: Events) {
this.datosUsuario = {
idticket: navParams.get("idticket_suport"),
nombre_usuario: navParams.get("nombre_usuario"),
consulta: navParams.get("consulta")
};
}
addZero(i){
if(i < 10){
i = "0" + i;
}
return i;
}
enviarMsj(chatinput:string) {
if (!this.editorMsg.trim()) return;
let now = new Date();
let day = ("0" + now.getDate()).slice(-2);
let month = ("0" + (now.getMonth() + 1)).slice(-2);
let hour = this.addZero(now.getHours());
let minute = this.addZero(now.getMinutes());
let second = this.addZero(now.getSeconds());
let today = now.getFullYear() + "-" + (month) + "-" + (day) + " " + (hour) + ":" + (minute) + ":" + (second);
this.msgData = {
idticket: this.datosUsuario['idticket'],
nombre_usuario: this.datosUsuario['nombre_usuario'],
mensaje: chatinput,
fecha: today
}
this._tp.postData(this.msgData, "generar_mensaje").then((result) =>{
this.msjEnviado = result;
console.log(this.msjEnviado);
this.listarMensajes();
this.editorMsg = '';
// console.log(this.msjEnviado);
this.scrollToBottom();
});
}
listarMensajes(){
let idusuario = localStorage.getItem('idusuario');
this.consulta = this.datosUsuario['consulta'];
//let nombre_usuario = localStorage.getItem('nombre_usuario');
this.userData = {
idticket: this.datosUsuario['idticket']
};
this._tp.postData(this.userData, "listar_mensaje").then((result) =>{
this.datosResp = result;
for (var i = 0; i < (this.datosResp).length; i++){
this.nombre_usuario = this.datosResp[i].nombre_usuario;
if(this.nombre_usuario == "Colegio"){
//this.clases.push('educontable');
this.estadoPositivo[i]=true;
}else{
//this.clases.push('cliente');
this.estadoPositivo[i]=false;
}
}
if(this.datosUsuario['idticket'] == undefined && this.idusuario == '1'){
this.navCtrl.setRoot('EducontablePage');
} else if(this.datosUsuario['idticket'] == undefined && this.idusuario != '1'){
this.navCtrl.setRoot('TicketsPage');
}
})
}
Thanks in advance