Я использую угловой 8.
У меня есть текстовое поле, которое состоит из текста. Я хочу, чтобы пользователь выделил текст. После завершения выбора я хочу вызвать функцию с выделенным текстом в качестве параметра.
Вот выделенное текстовое поле.
Теперь, когда реакция выбрана, я хочу вызвать функцию. Есть ли способ, я могу сделать это в Angular 8.
Всего 1 ответ
Предполагая, что ваше textbox
является textbox
HTML textarea
, вы определяете обработчик события select
следующим образом в своем шаблоне (здесь он указывает на метод onTextSelected
из вашего класса компонентов).
<textarea #textbox (select)="onTextSelected()">{{ text }}</textarea>
В классе вашего компонента вы должны получить ссылку на textare
поле с @ViewChild
декоратора @ViewChild
. Затем вам нужно реализовать метод onTextSelected
.
@ViewChild('textbox', { static: false}) textAreaRef: ElementRef<HTMLTextAreaElement>;
onTextSelected(): void {
const textArea = this.textAreaRef.nativeElement;
this.selectedText = textArea.value.substring(textArea.selectionStart, textArea.selectionEnd);
}
Пожалуйста, посмотрите на следующий StackBlitz .
Если вы действительно хотите вызвать метод с выделенным текстом, вы можете изменить свой шаблон следующим образом и избавиться от
@ViewChild
одновременно.
<textarea #textbox (select)="onTextSelected(textbox.value.substring(textbox.selectionStart, textbox.selectionEnd))">{{ text }}</textarea>
Это показано в следующем StackBlitz