typescript 如何启用输入字段,如果一个特定的垫选项被选中或不?

pvcm50d1  于 2023-04-22  发布在  TypeScript
关注(0)|答案(2)|浏览(107)

基于this topic的接受答案,我设法获得了单击选项的选定状态。我想根据对某个选项的选择禁用输入。通过下面的示例,我能够在选中/未选中任何选项时启用/禁用输入。例如,我想仅在第二个选项(Mushroom)未选中。如果选中第二个选项,则可以启用输入字段。我该如何操作?
StackBlitz Example

fslejnso

fslejnso1#

您可以通过将formcontrol值附加到mat-input的[disabled]指令来实现这一点。
1)仅读取toppings(表单控件)值

isValueSelected(): boolean {
    var valueArray: any = this.toppings.value || [];
    console.log(valueArray, valueArray.includes('Mushroom'));
    return !valueArray.includes('Mushroom');
 }

2)attach it to [disabled]指令

<input id="numeDB_SQLite" type="text" name="numeDB_SQLite" [disabled]="isValueSelected()"/>

我已经更新了你的stackblitz here.请upvote/选择如果帮助.

fnx2tebb

fnx2tebb2#

如果选择了某个值,则禁用

<input id="numeDB_SQLite" type="text" matInput 
      [disabled]="toppings?.value && toppings.value.length" ../>

如果在选择一个元素时要禁用,例如

<input id="numeDB_SQLite" type="text" matInput 
          [disabled]="toppings?.value && toppings.value.includes('Mushroom')" ../>

相关问题