Question

我正在使用离子3，我发现当我使用ion-textarea，并且在其中有断裂线，然后提交时，它将不会自动保留断裂线。

我的代码：

<ion-textarea #replyinput [(ngModel)]="commentData.comment" maxlength="200" name="comment" style="min-height:100px;" type="text" formControlName="comment" placeholder="{{ 'Comment.replyPlaceholder' | translate }}"></ion-textarea>

我已经输入了：

您好

大家

它显示：大家好，

任何人都知道如何解决？非常感谢

Answer 1

我花了几个小时来研究这个笑。

问题出在后uri（参数）上，不会给您的API带来换行符，因此我们应该在发布URI之前将URI编码为html特殊字符。

在这里阅读： https://www.w3schools.com/jsref/jsref_encodeuri.asp

这是我在html文件上的文本区域：

<ion-textarea no-margin rows="2" [(ngModel)]="userPost.text"></ion-textarea>

这是我的.ts文件：

var text = encodeURI(this.userPost.text);

对于输出，只需像普通字符串一样使用即可。

注意事项：根据以下答案添加空白：预变形CSS： https://stackoverflow.com/a/30593806/5769517

<p style="white-space: pre-wrap;">{{text}}</p>

将得到以下结果：

文本区域
  会尝试这是第1行
  这是第二行
  这是第3行


已处理/编码的结果
  will％20try％20this％20line％201％0Athis％20is％20line％202％0Athis％20is％20line％203

输出
  会尝试这是第1行
  这是第二行
  这是第3行

离子3离子 - textarea断线问题

1 个答案: