Question

我设计了一种将输入文本存储为字符串的表单，问题是，如果用户单击“ Enter”，则文本不会换行，而是会一起显示！我该如何解决我正在使用带有打字稿的angular6框架，我想知道管道是否可以解决这个问题？

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

Answer 2

所以，看来有很多方法可以做到，我选择的是

{{user.Diagnosis}}

似乎涉及的只是一些样式（空格和预包装）

感谢所有为Rohan Kumar提供帮助的人

从javascript表单中的输入文本的换行

2 个答案: