在angular中单击disable选项时弹出通知

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 item disabled can't click…

material.angular.io

/组件/选择/概述尝试添加自定义CSS，你可以用[class.nameyourclass]="vehicle.id ==8"试着为测试添加一个红色背景。