Поведение привязки Angular TextArea к клавише Ctrl-Enter - PullRequest
Новая
       7

Поведение привязки Angular TextArea к клавише Ctrl-Enter

0 голосов
/ 01 ноября 2018

Я пытался реализовать пользовательское поведение <textarea>, при котором событие enter вызовет функцию, а ctrl+enter вызовет новую строку на <textarea>.

Я пытался прочитать существующие вопросы здесь, но большинство из них использует plunker, и, как ни странно, я не могу их правильно загрузить.

Мне удалось заставить ключ enter отправлять что-то вместо следующей строки. Однако, когда я делаю событие ctrl-enter keydown, я не могу заставить textarea перейти на следующую строку.

См. Образец blitzstack .

1 Ответ

0 голосов
/ 01 ноября 2018

Я смог заставить его работать. Надеюсь, это даст вам отправную точку. :)

Обновлена ​​функция триггера до 

 triggerFunction(event) {
        console.log(event);
        if (event.ctrlKey && event.key === 'Enter') {
          /*
            cannot make textarea produce a next line.
          */
          var text = document.getElementById("textarea1");
          text.value += '\n';
          console.log(text);
        //  text = text.

          console.log("next line!");
        } else if (event.key === 'Enter') {
          event.preventDefault();
          console.log("submit!");
        }
      }

И изменить HTML на 

<div class="form-group">
    <label for="textarea1">Example textarea</label>
    <textarea 
      class="form-control"
      id="textarea1" 
      placeholder="Press Ctrl-Enter to do Next Line, otherwise Enter to Send"

      (keydown)="triggerFunction($event)"></textarea>
  </div>
...