Question

我有一个文本区域的问题，如果我修改了文本区域的内容，并且触发了（更改）操作，它将不会通过代码更改文本区域的内容。

这里是一个例子：

app.component.html

<textarea #content (change)="dosomething(content.value)">{{ thecontents | json }}</textarea>

app.component.ts

内容；

dosomething(data) {

    // this will overwrite whatever is already in the textarea
    this.thecontents = {  something : 'someother'};
}

由于某些原因，(change)触发时文本区域未更改

为什么？我该如何解决？

Answer 1

使用[value]或[ngModel]绑定文本区域的内容：

<textarea (change)="dosomething($event.target.value)" [value]="thecontents | json"></textarea>

<textarea (change)="dosomething($event.target.value)" [ngModel]="thecontents | json"></textarea>

有关演示，请参见this stackblitz。

Answer 2

如果您不想使用ngModel，则可以使用“查看子对象”指令获得相同的结果

@ViewChild('content') con:ElementRef;
  thecontents={something:''};
name='';
  dosomething(data) {

    // this will overwrite whatever is already in the textarea

this.con.nativeElement.value=1;

}

我已经编辑了您的代码，请检查https://stackblitz.com/edit/angular-xjksed

Angular 6-textarea（更改）永远不会更改textarea的内容

2 个答案: