Как выделить текст в текстовой области в угловых? - PullRequest
Новая
       10

Как выделить текст в текстовой области в угловых?

0 голосов
/ 29 декабря 2018

У меня есть форма textarea, и я хочу, чтобы, когда я набирал в нем более определенного числа символов (более 2200 символов), весь текст после этого выделялся.

Это мой HTML-код: 

<div class="form-group">
          <textarea type="text"
                    id="textAreaScroll"
                    formControlName="text"
                    placeholder="متن ..."
                    (keyup)="postLengthCheck('text')">
          </textarea>
</div>

и это мой машинописный код: 

postLengthCheck(input) {
    if (input === 'text') {
      if (this.createPostForm.controls['text'].value !== null) {
        this.postLength = this.createPostForm.controls['text'].value.length;
        this.validTextLength = 2200 - this.postLength;
        if (this.postLength > 2200) {
          this.x = this.createPostForm.controls['text'].value.substring(2200, this.postLength);
          console.log(this.x);
          this.match = new RegExp(this.x, 'ig');
          this.markText = '<mark>' + this.x + '<\/mark>';
          this.replaced = this.createPostForm.controls['text'].value.replace(this.match, this.markText);
          this.createPostForm.controls['text'].value = this.replaced;
        }
      }
    }
}

и в моем css я определяю mark класс, как показано ниже: 

mark {
  border-radius: 3px;
  color: transparent;
  background-color: #b1d5e5;
}

, но это не сработало.как я могу решить эту проблему?

1 Ответ

0 голосов
/ 29 декабря 2018

Я предлагаю вам не создавать свои собственные HTML-теги, вместо этого используйте что-то вроде <span class="highlighted-text">the text</span>.

Кроме того, textarea содержит только текст (не HTML), поэтому вы должны изменить его на <div contenteditable="true">the text</div>, так работает каждый редактор HTML WYSIWYG.

...