ionic3 - Ionic 3 ion-textarea换行问题

Question

我使用的是ionic 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

我花了几个小时来完成这个哈哈。

问题出在 post uri(参数)上，它不会给您的 API 带来换行符，因此我们应该在发布之前将 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>

将得到这样的结果:

Text Area
will try this is line 1
this is line 2
this is line 3

Processed / Encoded result
will%20try%20this%20line%201%0Athis%20is%20line%202%0Athis%20is%20line%203

Output
will try this is line 1
this is line 2
this is line 3