Angular2 - Get ausgewählten Teil des Textes Wert

Question

Ich möchte einen einfachen Editor erstellen, um ausgewählte Text zum Beispiel fett zu machen.

Es gibt ein Textfeld mit "Super Text" -Wert.

Jetzt wähle ich einen Teil dieses Textes (zum Beispiel "Super"). Wie bekomme ich den ausgewählten Wert?

Dies ruft eine Funktion jedes Mal auf, wenn ich etwas in Textarea auswähle.

<textarea (selected)="view(textarea.value)" #textarea></textarea> 

Dies wird einen ganzen Textarea-Wert drucken, wenn ich etwas auswähle. Ich möchte nur den Teil des Textes drucken, der ausgewählt wird. Wie geht das?

Answer 1

Ich sehe, dass Sie Ihre Funktion mit dem (ausgewählten) Attribut auf texarea binden. Dies sollte (auswählen) sein, da dies das Ereignis ist, das für die Auswahl ausgelöst wird. Aber da Sie sagen, dass Sie Ihren Callback ausführen lassen, würde ich einen Tippfehler vermuten.

Nun zur Hauptfrage. Auf der Textfläche haben Sie zwei Eigenschaften selectionStart und selectionEnd, die wie der Name vermuten lässt, Indizes der Position in dem Wert sind, aus dem die Auswahl beginnt und endet. So können Sie die ausgewählten Teilzeichen bekommen

textarea.value.substring(textarea.selectionStart, textarea.selectEnd) 

durch die Verwendung können Sie den Wert eines Ausdrucks passieren innerhalb von Funktionen Ihrer Komponente. Daher werden Sie dies tun

<textarea (select)="view(textarea.selectionStart, textarea.selectEnd)" #textarea></textarea> 

Hier ist eine Arbeit Geige für die gleiche. https://jsfiddle.net/h191w4ed/1/