单击 angular 中的禁用选项时弹出通知

Question

我试图在单击禁用选项时弹出通知 (alert)。

首先我有这个 component.html:

      <div class="col-lg-6 col-md-6">
        <div class="from-group">
          <label for="vehicle"> Vehicle </label>
          <select
            type="text"
            class="form-control"
            formControlName="vehicle_index"
            (click)="showAlert()"

           >
           <option value="">--Select a Vehicle--</option>
            <option
              *ngFor="let vehicle of vehicles; let i = index"
              value="{{ i }}"
              [disabled]="vehicle.id == 8"
            >
               {{vehicle.model}} - {{vehicle.plate_number}}
            </option>
          </select>
        </div>
      </div>

正如我们所见，我在 id = 8 时禁用了选项。

函数showAlert():

  showAlert(){
    if (this.plannedRouteForm.get("vehicle_index").value.disabled == true) {
      alert(" Disabled");
  }
  }

我在想的是当我点击选项中的值时我检查是否禁用？然后显示警报。

可惜NOT WORK.

我做错了什么？

Answer 1

mat select 项目已禁用无法点击...

material.angular.io/components/select/overview

尝试添加自定义 CSS，您可以使用 [class.nameyourclass]="vehicle.id ==8" 更改 [disabled] 尝试添加背景红色仅供测试.

单击 angular 中的禁用选项时弹出通知

pop notification when clicked on disable option in angular

javascript

angular

formgroups