Winkel 2 Eingang mit Bildunterstützung

Ich möchte eine Chat-App mit Winkel 2 erstellen und ich muss Emojis im Eingabefeld anzeigen, aber HTML unterstützt kein Bild im Eingabefeld.
auch habe ich versucht auf diese Weise, aber nicht funktioniert:Winkel 2 Eingang mit Bildunterstützung

<div contenteditable="true" 
    [innerHtml]="msgText" 
    class="form-control" 
    (keyup)="enable_disable_sendBtn()" 
    (keypress)="handle_enter_key($event)" 
    #messageBox 
    (input)="msgText = $event.target.innerText"> 
</div>

Ich habe this versucht, aber nicht habe ich Fehler bekam von tslint und sagt: use @HostListener Or @HostBinding instead of host.
Kann mir jemand helfen, Emjis in der Texteingabe zu zeigen?

Quelle

2017-09-04 amirsa00

"aber nicht funktioniert" ist nicht genug Informationen. Was ist das erwartete Verhalten? Was ist das tatsächliche Verhalten? Irgendwelche Fehlermeldungen? –

Vielleicht möchten Sie https://www.emojione.com/ oder ähnliches verwenden –

@ GünterZöchbauer Ich erwarte, Bilder zu zeigen, und es zeigt, aber das Problem ist, wenn ich versuche, 'amir' zu schreiben, schreibt es' rima', so ist das Problem Immer wenn eine Taste gedrückt wird (oder keyup oder keydown, ich weiß nicht, was das Problem ist), geht das Caret zum ersten der Eingabe – amirsa00

Endlich finde ich eine Lösung. Die Lösung ist eine Art und Weise verbindlich, denn der Benutzer schreibt etwas in der contenteditable und ich muss nur die innerHTML bekommen, wenn ich möchte, z. B. wann den Inhalt zu senden.
auch wenn ich ein Bild zum Inhalt hinzufügen möchte, einfach ich die contenteditable hinzufügen und wenn ich (oder so ähnlich) senden muss, bekomme ich die innerHTML.

<div contenteditable="true" 
    class="form-control" 
    id="messageBox" 
    #messageBox 
    (keydown.enter)="handle_enter_key($event)" 
    (input)="handleMessageBoxInput($event)"> 
</div>

Quelle

2017-09-11 04:32:35 amirsa00

Winkel 2 Eingang mit Bildunterstützung

Antwort

Verwandte Themen