rpaschoal / ng-chat

💬 A simple facebook/linkedin lookalike chat module for Angular applications.
MIT License
155 stars 92 forks source link

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. #148

Closed aonstu closed 4 years ago

aonstu commented 4 years ago

i'm trying to integrate ng-chat into my angular app and i run into this error. has anyone encountered this before?
`

ng-chat demo

{{userId}}

Login

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

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

my .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)
});

}

} app.module imports : const config: SocketIoConfig = { url: 'http://proficient.simbiotiktech.com:4000', options: {} };

@NgModule({ declarations: [ AppComponent, MainHeaderComponent, SideMenuComponent, DragDropDirective, TestComponent, LoginComponent, ForgotPasswordComponent, SuccessModalComponent, LoadingModalComponent, ReminderComponent, ConfirmationComponent, CancelModalComponent, ContactAddressComponent, GlobalNotificationComponent, GlobalChatComponent,

], imports: [ BrowserModule, AppRoutingModule, BrowserAnimationsModule, FormsModule, ReactiveFormsModule, MaterialModule, NgSelectModule, HttpClientModule, SharedModule, ChartsModule, FullCalendarModule, UserAccountModule, HttpModule, NgChatModule, SocketIoModule.forRoot(config)

], entryComponents: [SuccessModalComponent, LoadingModalComponent, ReminderComponent, ConfirmationComponent, CancelModalComponent], schemas: [CUSTOM_ELEMENTS_SCHEMA], providers: [CommonProvider, UploadProvider, { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptorService, multi: true }], bootstrap: [AppComponent] }) export class AppModule { } `

FatimaEzzahraaAbdelhak commented 4 years ago

why ur'are lying ?