save

src/app/pages/chat/group-messages/group-messages.page.html

@@ -33,11 +33,12 @@
     <ion-refresher-content>
     </ion-refresher-content>
   </ion-refresher>
-  <div class="welcome-text">
-    <ion-label>Esta conversa passou a grupo</ion-label><br />
-    <ion-label>A conversa original mantêm-se como chat individual</ion-label>
-  </div>
+
   <div class="messages overflow-y-auto" #scrollMe>
+    <div class="welcome-text">
+      <ion-label>Esta conversa passou a grupo</ion-label><br />
+      <ion-label>A conversa original mantêm-se como chat individual</ion-label>
+    </div>
     <div *ngFor="let msg of messages" >
       <div *ngIf="msg.t != 'r'" class='incoming-{{msg.u.username!=loggedUser.me.username}}'>
         <div class="title">

src/app/pages/chat/group-messages/group-messages.page.scss

@@ -123,8 +123,17 @@
     font-size: 13px;
     font-family: Roboto;
     overflow: auto;
+
+    //set scroll do bottom
+    position: absolute;
+    top: 0;
+    left: 0;
+    overflow-x: hidden;
+    overflow-y: auto;
     width: 100%;
-    //height: 100%;
+    height: 100%;
+    word-wrap: break-word;
+    -webkit-overflow-scrolling: touch;
 
     .incoming-true, .incoming-false{
       width: 305px;

src/app/pages/chat/group-messages/group-messages.page.ts

@@ -1,4 +1,4 @@
-import { Component, ElementRef, OnInit, ViewChild } from '@angular/core';
+import { Component, ElementRef, OnInit, ViewChild, AfterViewChecked } from '@angular/core';
 import { ActionSheetController, MenuController, ModalController, NavParams, PopoverController } from '@ionic/angular';
 import { AlertService } from 'src/app/services/alert.service';
 import { AuthService } from 'src/app/services/auth.service';
@@ -14,7 +14,7 @@ import { GroupContactsPage } from './group-contacts/group-contacts.page';
   templateUrl: './group-messages.page.html',
   styleUrls: ['./group-messages.page.scss'],
 })
-export class GroupMessagesPage implements OnInit {
+export class GroupMessagesPage implements OnInit, AfterViewChecked {
   showLoader: boolean;
   isGroupCreated:boolean;
   loggedUser: any;
@@ -51,6 +51,7 @@ export class GroupMessagesPage implements OnInit {
     console.log(this.roomId);
     this.loggedUser=this.loggedUserChat;
     this.getRoomInfo();
+    this.scrollToBottom();
   }
 
   ngAfterViewChecked() {
@@ -127,12 +128,8 @@ export class GroupMessagesPage implements OnInit {
     }
   }
   sendMessage(){
-
     let body = {
-      "message":
-      {
-        "rid": this.roomId, "msg": this.message
-      }
+      "message": { "rid": this.roomId, "msg": this.message }
     }
 
     this.chatService.sendMessage(body).subscribe(res=> {

src/app/pages/chat/messages/messages.page.html

@@ -35,7 +35,7 @@
     <ion-refresher-content>
     </ion-refresher-content>
   </ion-refresher>
-  <div id="scrollToBottom" class="messages" #scrollMe>
+  <div class="messages" #scrollMe>
     <div *ngFor="let msg of messages" class='incoming-{{msg.u.username!=loggedUser.me.username}}'>
       <div class="title">
         <ion-label>{{msg.u.name}}</ion-label>