javascript - 在 javascript 中从表单中换行输入文本

Question

我设计了一个表单，它接受输入文本并将其存储为字符串，问题是，如果用户点击“Enter”，文本不会换行，而是会一起显示!我该如何解决这个问题我正在使用 Angular6 框架和 Typscript，我想知道管道是否可以解决这个问题？

Answer 1

您无法管理文本框中的“输入”键。要查看输入字符串中的 enter 键，您必须使用 textarea(您可以将其样式设置为文本框)，例如，

HTML:

<textarea type="text" #elem></textarea><br/>
<button (click)="checkValue()">Click to see the value</button>
<div *ngIf="value!=''">
    You have typed:<p style="white-space: pre-wrap;">{{value}}</p>
</div>

TS:

export class AppComponent  {
  @ViewChild("elem") inputChild: ElementRef;
  value='';
  checkValue(){
     this.value= this.inputChild.nativeElement.value;
  }
}

Stackblitz Demo

使用ngModel更新

HTML:

<textarea [(ngModel)]="value" #elem></textarea><br/>
<div *ngIf="value!=''">
  You have typed:<p style="white-space: pre-wrap;">{{value}}</p>
</div>

TS:

export class AppComponent  {
   @ViewChild("elem") inputChild: ElementRef;
   name = 'Angular 6';
   value='';
}

Updated Demo