时间戳

首页 > 解决方案 > 如何在以两种方式绑定显示之前从“ngModel”编辑数据

angular - 如何在以两种方式绑定显示之前从“ngModel”编辑数据

问题描述

    <textarea #hello class="form-control" name="Input" type="text" rows="10" cols="40" [(ngModel)]="answer">
    </textarea>
    
    <div class="message">
      {{ answer }}
    </div>

    transform(value: string): string {
        return value.replace(/\\n/g, '<br />');
      }
    answer = '';

我的要求是我需要从用户那里获取一些数据，将其存储在一个变量中，进行一些更改/替换一些东西，保留它的状态（换行符，空格）然后显示它。

我可以在显示之前拦截来自 ngModel 的数据并将其存储在变量中，进行更改然后将其显示为正常的 ngModel

如果这是不可能的，请感谢通过任何其他方法满足此要求的任何帮助。需要一些指导

标签： angulartypescriptangular-ngmodel

解决方案

<textarea #hello class="form-control" name="Input" type="text" 
 rows="10" cols="40" [(ngModel)]="answer" (keyup) 
  ="onKeyUp($event)">
  </textarea>

  <div class="message">
 {{ formated }}
  </div>

打字稿

onKeyUp(event: any)
{
This.formated = event.target.value.replace(/\\n/g, '<br />');
 }
 answer = '';
 formated: string

推荐阅读