在 Angular7 的 <option> 中显示和隐藏跨度

Question

我遇到了一个问题，我需要在 select 的 option 中显示/隐藏 span。

当用户将鼠标悬停在选项上时，我需要显示金额，如果用户选中其中一个选项，则我需要隐藏金额。

不想使用 Jquery，这里使用简单的原生 javascript。

这是我的演示 https://stackblitz.com/edit/angular-auirs1

应用 css 显示和隐藏跨度，但它不起作用

Answer 1

您可以尝试在 select 上使用 ngModel 并在您的 span 上检查其选定值，如下所示：

<select [(ngModel)]="select">
        <option *ngFor="let bank of banks">
          {{ bank }}
        <span *ngIf="!select" class="only-show-on-hover">1000$</span>
</select>

希望对你有帮助。