Angular 5中类型复选框的动态输入

Posted 2023-02-22

【中文标题】Angular 5中类型复选框的动态输入

【英文标题】：Dynamic input of type checkbox in Angular 5

【发布时间】：2018-10-17 09:16:12

【问题描述】：

我有以下代码

<input [type]="'checkbox'" [(ngModel)]="inputValue">
<p>Value:  inputValue </p>

有人可以解释为什么inputValue 中的值没有改变吗？

我不能只设置type="checkbox"，因为我有动态类型的输入。

当类型为text 或number 时，它可以正常工作。它也适用于输入类型为静态 (type="checkbox")

【问题讨论】：

我不会动态设置类型，而是使用*ngIf呈现其中一种类型

你的意图是显示价值：真（或假）吗？

@tt9 是的，我希望inputValue 在选中/取消选中复选框时进行更改

也许这会有所帮助：***.com/a/40214714/2313300

【参考方案1】：

如果动态设置输入类型不起作用，为什么不尝试ngSwitch 与复选框的静态输入类型？

<ng-container [ngSwitch]="inputType">
    <input *ngSwitchCase="'checkbox'" type="checkbox" [(ngModel)]="inputValue">
    <input *ngSwitchDefault [type]="inputType" [(ngModel)]="inputValue">
</ng-container>

看看这个stackblitz。

【讨论】：

谢谢。我最终做到了。奇怪的是，这不是开箱即用的。