ng-chat component couldn't be bootstrapped

[sachinbasendr]

I got this message ng-chat component couldn't be bootstrapped i am using bootstrap "dependencies": { xyz, "@ng-bootstrap/ng-bootstrap": "^4.0.1", xyz, }

[JacobSiegle]

Your app bootstrapping is not the same thing as ng-bootstrap. Please see - https://angular.io/guide/bootstrapping.

Are you sure you included ng-chat in your project correctly? Can you elaborate on the error?

[rpaschoal]

Hi @SachinJat ,

This indicates that some of the required inputs weren't provided to ng-chat. Have you supplied a chat adapter implementation to it?

Cheers!

[sachinbasendr]

Yes i have you supplied a chat adapter implementation but something i have missed on it

But Now ok Thanks.

[shakthi-manai]

I have the same issue and i am unable to resolve it. ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component. I have used the code as it is from the sample

[ssubham]

I have the same issue and i am unable to resolve it. ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component. I have used the code as it is from the sample

Did you have got this issue resolved.?

[sachinbasendr]

Yes,

Thanks

On Fri, Jan 10, 2020 at 12:26 PM ssubham notifications@github.com wrote:

I have the same issue and i am unable to resolve it. ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component. I have used the code as it is from the sample

Did you have got this issue resolved.?

— You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub https://github.com/rpaschoal/ng-chat/issues/132?email_source=notifications&email_token=AJX64H4URXAZFJICVOVFYJTQ5ALYLA5CNFSM4ILR43SKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEIS4FXQ#issuecomment-572900062, or unsubscribe https://github.com/notifications/unsubscribe-auth/AJX64H6IE444GL2CV5HZXWTQ5ALYLANCNFSM4ILR43SA .

-- Sachin Basendra Sr. Executive Developer www.flitwebs.com https://mailtrack.io/trace/link/7f81af63c6b0ad7f29ec0032125c960781dd3c5a?url=http%3A%2F%2Fwww.flitwebs.com%2F&userId=1177166&signature=b4043ab3ec82a9b4

sachin.b@flitwebs.com 505-506 5th Floor, Mansarovar Plaza, Mansarovar, Jaipur 302020, INDIA Phone : +91 9694571936

[ssubham]

Yes, Thanks … On Fri, Jan 10, 2020 at 12:26 PM ssubham @.**> wrote: I have the same issue and i am unable to resolve it. ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component. I have used the code as it is from the sample Did you have got this issue resolved.? — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub <#132?email_source=notifications&email_token=AJX64H4URXAZFJICVOVFYJTQ5ALYLA5CNFSM4ILR43SKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEIS4FXQ#issuecomment-572900062>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AJX64H6IE444GL2CV5HZXWTQ5ALYLANCNFSM4ILR43SA . -- Sachin Basendra* Sr. Executive Developer www.flitwebs.com https://mailtrack.io/trace/link/7f81af63c6b0ad7f29ec0032125c960781dd3c5a?url=http%3A%2F%2Fwww.flitwebs.com%2F&userId=1177166&signature=b4043ab3ec82a9b4 sachin.b@flitwebs.com 505-506 5th Floor, Mansarovar Plaza, Mansarovar, Jaipur 302020, INDIA Phone : +91 9694571936

May you let me know how you did it as i am getting issue to integrate with my website?

[sachinbasendr]

Hi @ssubham

You have to provide a ChatAdapter on it,Then it will ok

[ssubham]

Hi @ssubham

You have to provide a ChatAdapter on it,Then it will ok

I have already used ChatAdapter(socketio-adapter) on it with extended chatAdapter. And trying to integrate with my parent application.

[sachinbasendr]

Can you share both code for html and ts?

[ssubham]

chatApplication.zip

Hi @ssubham You have to provide a ChatAdapter on it,Then it will ok

I have already used ChatAdapter(socketio-adapter) on it with extended chatAdapter. And trying to integrate with my parent application.

May you share a piece of code how you made it integrated/worked?

[aonstu]

Can you share both code for html and ts?

<!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center">
  <h1>
    ng-chat demo
  </h1>

  <div>{{userId}}</div>
  <div class="form-box">
    <h3>Login</h3>

    <small>Pick a username to join a ng-chat node.js room. Hint: Try different browsers or incognito tabs.</small>

    <form>

      <label for="name">Name:</label>
      <input type="text" class="form-control" id="name" required [(ngModel)]="userName" name="name">

      <button type="submit" class="btn btn-success" (click)="joinRoom()">Join</button>
    </form>
  </div>
</div>

<ng-chat [adapter]="adapter" [userId]="userId" [historyEnabled]="true" [theme]="'dark-theme'"></ng-chat>

the .ts file :

import { Component, OnInit } from '@angular/core';
import { ChatService } from './chat.service';
import { ChatAdapter, ParticipantResponse, User, Message } from 'ng-chat';
import { Socket, SocketIoConfig } from 'ng-socket-io';
import { SocketIOAdapter } from './socketio-adapter';
import { HttpClient } from '@angular/common/http';
import { Http } from '@angular/http';
const config: SocketIoConfig = { url: 'http://proficient.simbiotiktech.com:4000', options: {} };

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

  // properties
  user;
  message;
  userName;
  userId;
  public adapter: ChatAdapter;
  data;
  chatUserEmail: string = "";
  chatId: string;
  chatUserId: string = String(Math.floor(Math.random() * 100));
  chatUserStatus: string;
  userAvatar: string

  constructor(private http: Http, private httpClient: HttpClient, private socket: Socket) {

    console.log('global chat loaded');
    this.InitializeSocketListerners();

  }

  ngOnInit() {
    this.user = JSON.parse(localStorage.getItem('userDetail'));
    this.userId = this.user.id;
    console.log("this is the userId : " + this.userId);
    this.userName = this.user.name;
    console.log("this is the user name : " + this.userName);
    this.joinRoom();

  }

  // joinRoom() {
  //   console.log('join room clicked');
  //   this.chatServie.joinRoom(this.userName);
  // }

  // sendMessages() {
  //   this.chatServie.sendMessage(this.message);
  // }

  public joinRoom(): void {
    const data = { userId: this.userId, userName: this.userName };

    this.socket.emit("join", data);
  }

  getMessages() {

  }

  public InitializeSocketListerners(): void {
    //console.log(socket);
    this.socket.on("generatedUserId", (userId) => {
      // Initializing the chat with the userId and the adapter with the socket instance      
      //console.log(userCollect);
      if (this.userId == "") {
        //this.userId = userId['socketId'];
        this.userId = userId;
        //console.log(this.userId)
        //this.adapter = new SocketIOAdapter(this.chatUserId, this.userId, this.useremail, this.projectId, this.socket, this.http);
        this.adapter = new SocketIOAdapter(this.userId, this.socket, this.http, this.httpClient);
        //console.log(usersCollection.filter(x => x.participant.id != this.chatId));
        //this.adapter.onFriendsListChanged(usersCollection.filter(x => x.participant.id != this.userId));
      }

      //console.log("InitializeSocketListerners", this.userId)
    });
  }

}

[sachinbasendr]

Hi, You should try with static user id as userId: 999 if it was ok Then you want to put on "<ng-chat>" in ngIf condition on userId

[rpaschoal]

Just re-opening this as there is an ongoing discussion here

[aonstu]

tried passing a static userId : 999 .doesn't seem to work.still ng-chat cannot be bootstrapped.

[rvkvino]

@aonstu Did you solve this issue. Now same code as you mentioned I have tried but getting issue ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component.

[rvkvino]

May I know how you have resolved this issue. Still I'm facing the issue.

[glglak]

I am facing same issue on dotnet core 3.0 and Azure Signal R so I used Azure Signal R adapter class in type script as an adapter like the below

`  <ng-chat 
                   [adapter]="signalRAdapter"
                   [groupAdapter]="signalRAdapter"
                   [userId]="12345"
                   [historyEnabled]="false"
                   [pollFriendsList]="true"
                   [theme]="currentTheme"
                   [fileUploadUrl]="fileUploadUrl"
                   (onParticipantClicked)="onEventTriggered('ParticipantClicked triggered')"
                   (onParticipantChatOpened)="onEventTriggered('ParticipantChatOpened triggered')"
                   (onParticipantChatClosed)="onEventTriggered('ParticipantChatClosed triggered')"
                   (onMessagesSeen)="onEventTriggered('MessageSeen triggered')">

          </ng-chat>`

and defined the adapter in TS as below

public signalRAdapter: SignalRGroupAdapter; where SignalRGroupAdapter got the implementation with localhost so why I am getting ng-chat can't be bootstrapped without a ChatAdapter. Please make sure you've provided a ChatAdapter implementation as a parameter of the ng-chat component.

could someone elaborate what I am missing please?

[rpaschoal]

@glglak This seems to indicate that your signalRAdapter variable/property value is most likely null or undefined.

If you check this section you will see when ng-chat raises the message you are receiving: https://github.com/rpaschoal/ng-chat/blob/d812e92f7acdee4584126025a841806f9b423b61/src/ng-chat/ng-chat.component.ts#L295

[ermarkar]

In my case, i was returning null from the listFriends and getMessageHistory methods of adapter implementation, so I changed it to

listFriends(): Observable<ParticipantResponse[]> {
    return of([]);
}

getMessageHistory(destinataryId: any): Observable<Message[]> {
    return of([]);
}