从下拉菜单中选择“自定义选项”后如何启用输入文本框?

Shree Batale

JSON数据

 loginValue: any[] = [
    { value: 'col-1', viewValue: 'facebook' },
    { value: 'col-2', viewValue: 'google' },
    { value: 'col-1', viewValue: 'Custom' }
  ];

的HTML

<mat-form-field>
                    <mat-select placeholder="login Value" [disabled]="isDisabled1">
                      <mat-option *ngFor="let loginvalue of loginValue" [value]="loginvalue.value">
                        {{loginvalue.viewValue}}
                      </mat-option>
                    </mat-select>
                  </mat-form-field>

                  <div class="col-md-2">
                  <mat-form-field class="Custom">
                    <input matInput placeholder="Enter Custom Value" [disabled]="isDisabled1">
                  </mat-form-field>

我的下拉选项中有三个值facebook / google /自定义当我选择facebook和Google时,必须禁用文本框输入;当我单击“自定义”选项时,要启用输入文本框,如何在打字稿中编写逻辑或可以完成所有操作仅在HTML中?提前致谢!

只是代码

您需要的是将模型绑定到变量:[(ngModel)]="selectedValue"并在disabled属性中使用它。然后像这样检查禁用的属性

  [disabled]="selectedValue.viewValue!=='Custom'"

请注意 : [value]="loginvalue"

在此处查看示例您将找到ngmodel示例

这是我更改的代码。

<mat-form-field>
    <mat-select placeholder="login Value" [(ngModel)]="selectedValue" [disabled]="isDisabled1">
        <mat-option *ngFor="let loginvalue of loginValue" [value]="loginvalue">
            {{loginvalue.viewValue}}
        </mat-option>
    </mat-select>
</mat-form-field>

<div class="col-md-2">
    <mat-form-field class="Custom">
        <input matInput placeholder="Enter Custom Value" [disabled]="selectedValue.viewValue!=='Custom'">
                  </mat-form-field>
  </div>

Stackblitz演示

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

从SuiteScript的下拉菜单中选择选项后,如何显示文本框?

使用 selenium python 在下拉菜单中选择选项后,在文本框中输入值

从下拉菜单中选择选项后的事件

如何根据从下拉菜单中选择的选项设置不同的输入字段模式?

从下拉菜单中选择某个选项后,如何触发某些内容?

如何根据从下拉菜单中选择的选项以 HTML 格式显示文本?

如何从下拉菜单中选择文本和值?

如何使用angular 7从下拉菜单中选择图像后获取图像和文本

jQuery / asp.net-仅在用户在文本框中输入文本并从下拉列表中选择一个值后,“启用/禁用”按钮

从下拉菜单中选择时,为显示/隐藏文本框提供必填字段

当用户从下拉菜单中选择一个选项时,如何更新任何归档的文本?

如何使用Selenium和Python通过部分文本从下拉菜单中选择选项

允许用户从下拉菜单中选择选项

Python - 从下拉菜单中选择选项

RSelenium:从下拉菜单中选择选项

当下拉菜单具有相同的ID时,如何从下拉菜单中选择一个选项

tablesorter从选择下拉菜单和自定义时间过滤器中选择多个选项?

从下拉列表中选择其他选项时激活文本框

PHP 代码使用文本框输入插入 sql db,但不使用选择选项(下拉菜单)

如何使用Selenium和Python从下拉菜单中选择一个选项

如何从下拉菜单中选择一个选项

从下拉菜单中选择特定选项时如何document.write

如果从下拉菜单中选择选项,则如何断言。硒。页面对象模型

从下拉菜单中选择特定选项时,如何更改段落?

如果没有从下拉菜单中选择任何选项,如何防止表单提交

如何为微调框自定义下拉菜单?

自定义选择下拉菜单

使用 Python 从下拉菜单中选择后如何获得价值?

从下拉菜单中选择元素后,如何显示它?