Angular TextArea 行为绑定到 Ctrl-Enter 键

lem*_*des 5 html bootstrap-4 ng-bootstrap angular

我一直在尝试实现一个自定义<textarea>行为,其中enter事件将触发一个函数并ctrl+enter触发<textarea>.

我一直在尝试阅读这里现有的问题,但其中大多数都在使用 plunker,而且奇怪的是我无法正确加载它们。

我已经设法让enter密钥提交一些东西而不是做下一行。但是,当我执行ctrl-enterkeydown 事件时,我似乎无法让 textarea 转到下一行。

请参阅此blitzstack以获取示例。

Asl*_*lam 12

我能够让它工作。希望这会给你一个起点。:)

将 triggerFunction 更新为

 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!");
        }
      }
Run Code Online (Sandbox Code Playgroud)

并将 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>
Run Code Online (Sandbox Code Playgroud)


Jam*_*s H 12

这更容易

(keydown.control.enter)="onCtrlEnter()"
Run Code Online (Sandbox Code Playgroud)