即使在Angular中禁用，也会触发选项标签

Question

我有两个select如下：

     <select size="10" class="custom-select mr-4">
        <optgroup label="Properties">
          <option *ngFor="let eachVal of dataProps"
          (click)="getPropValues(eachVal)">
            {{eachVal.property}}
          </option>
        </optgroup>
        <optgroup label="References" [disabled]="propClicked">
          <option *ngFor="let eachVal of objProps"
          (click)="getReferenceValues(eachVal)"> <!--Interesting !!!-->
          {{eachVal.property}}</option>
        </optgroup>
      </select>

如果点击了属性中的任何<optgroup>，我想禁用点击引用option。

函数getPropValues()触发propClicked布尔标志，我可以看到该组被禁用，但是在单击References中的任何禁用选项仍会触发getReferenceValues()函数。

(click)优先于[disabled]吗？

我有working example on StackBlitz。