如何根据从下拉列表中选择的值禁用 textarea [重复]答案

【问题标题】：How to disable textarea based on the value selected from dropdown [duplicate]如何根据从下拉列表中选择的值禁用 textarea [重复]
【发布时间】：2021-09-14 08:46:50
【问题描述】：

我想根据从下拉值中选择的选项禁用文本区域。在我的component.ts 文件中，我定义了一个变量来跟踪是否要禁用文本区域

messageDisabled: boolean = false，还有一个函数可以触发下拉值的变化

getdropdownGender(event) {
    const value = event;
    if (value == 'a' || value == 'b')
      this.messageDisabled = true
    else
      this.messageDisabled = false
  }

我的component.html文件的部分是

<div class="row">
            <div class="col-md-6">
              <div class="form-group">
                <label>Gender</label><span class="asterick">*</span>
                <select
                  type="text"
                  formControlName="gender"
                  class="form-control border-primary"
                  [(ngModel)]="selected_gender"
                  #t
                  (change)="getdropdownGender(t.value)"
                >
                  <option value="">Select Gender</option>
                  <option
                    value="{{ _position }}"
                    *ngFor="let _position of genderList"
                  >
                    {{ _position }}
                  </option>
                </select>
              </div>
            </div>
            <div class="col-md-6">
              <div class="form-group">
                <label>Message</label>
                <textarea
                  [disabled]="messageDisabled"
                  cols="30"
                  rows="3"
                  type="text"
                  class="form-control border-primary"
                  formControlName="message"
                  placeholder="Message"
                >
                </textarea>
              </div>
            </div>
          </div>

但是文本区域中的[disabled]参数不起作用（基于messageDisabled值的条件）。谁能帮我解决这个问题？

【问题讨论】：

您是否检查过messageDisabled 是否按照您的预期改变了它的值？我在您发布的代码中看不到问题。 [disabled] 看起来不错
@Adrian Kokot 是的，messageDisabled 值在下拉值更改时按预期更改。但是文本区域disabled 功能没有改变。根据上面编写的代码，文本区域在任何下拉值中都没有被禁用
@AdrianKokot 如果我使用attr.disabled 代替disabled，那么文本区域始终保持disabled
您是否尝试过设置为null 如果为假？喜欢here？
是的，@AdrianKokot 在设置为 null（如果为 false）时工作。谢谢！！

标签： angular

【解决方案1】：

我认为你可以使用 *ngif

<textarea *ngIf="value == 'a' || value == 'b'" cols="30" rows="3" type="text"
            class="form-control border-primary" formControlName="message" placeholder="Message">
      </textarea>

【讨论】：

【解决方案2】：

禁用属性是一个布尔属性。由于不需要值，您可以这样做：

<textarea {{ messageDisabled ? "disabled" : "" }}></textarea>

或

<textarea {{ messageDisabled ? "disabled='disabled'" : "" }}></textarea>

【讨论】：