在angular2中选中复选框时如何动态生成textarea答案

【问题标题】：How to generate textarea dynamically when checkbox is checked in angular2在angular2中选中复选框时如何动态生成textarea
【发布时间】：2023-03-11 13:03:01
【问题描述】：

我是Angular2的新手，尝试在选中复选框时动态生成textarea，并在angular2中未选中复选框时删除textarea。有没有更好的解决方案？提前致谢。

【问题讨论】：

标签： angular2-routing angular2-template angular2-forms angular2-services angular2-directives

【解决方案1】：

<input type="checkbox" #mycheckbox />
<textarea *ngIf="mycheckbox.value"></textarea>

【讨论】：

谢谢维克多先生，但我在点击事件中需要这个，比如 (change)="textarea($event)" ，javascript 如何使用 var textnode = document.createTextNode("Water"); node.appendChild(textnode); document.getElementById("myList").appendChild(node);
这不是一个角度的方式，但你的问题是什么？

【解决方案2】：

设置ngModel，然后将其存储为变量：

<input type="checkbox" #isVisible="ngModel" [(ngModel)]="isTextareaVisible">

然后使用*ngIf 切换它：

<textarea *ngIf="isVisible"></textarea>

旁注：如果这是在表单标签内，不要忘记在input 中添加name="isTextareaVisible" 属性，否则 Angular 会报错。

【讨论】：

感谢 Chrillewoodz，但我在点击事件中需要这个，例如 (change)="textarea($event)"，javascript 如何使用 var textnode = document.createTextNode("Water"); node.appendChild(textnode); document.getElementById("myList").appendChild(node);