При выборе эмодзи сообщение отправляется мгновенно, вместо ожидания нажатия кнопки «Отправить».

Question

Мы используем эту библиотеку https://github.com/ahkohd/ngx-emoji-picker для реализации смайликов в нашем чате.Проблема в том, что когда вы выбираете эмодзи в палитре, он отправляет сообщение мгновенно и не позволяет продолжить ввод сообщения и нажатие кнопки «Отправить».Вот код:

SendMessage() {
    if (this.message) {
      console.log('ts', this.receiverData.username);
      this.msgService
        .SendMessage(this.user._id, this.receiverData._id, this.receiverData.username, this.message)
        .subscribe(data => {
          this.socket.emit('refresh', {});
          this.message = '';
        });
    }
  }

  handleSelection(event) {
    console.log(event.char);
    this.message += event.char;
  }

HTML

 <div class="message-input">
            <div class="wrap">
                <div class="colinput">
                    <input [(ngModel)]="message" [ngModelOptions]="{standalone: true}"
                        (keypress)="IsTyping()" type="text" placeholder="Write your message..." />
                </div>
                <i class='attachment'
                (click)="toggled = !toggled"
                [(emojiPickerIf)]="toggled"
                [emojiPickerDirection]="'top'"
                (emojiPickerSelect)="handleSelection($event)">?</i>
                <button class="submit"><i class="fa fa-paper-plane" aria-hidden="true"></i></button>
            </div>
        </div>

Что может вызвать такую ​​проблему и как ее можно исправить?

Answer 1

Если вы использовали (ngSubmit) = "SendMessage ()" в теге формы, любое нажатие кнопки внутри этой формы вызовет метод SendMessage, это может быть проблемой в вашем случае. Одним из способов избежать этого является использование события click накнопка отправки