html - 在 Angular7 的 中显示和隐藏跨度

Question

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

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

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

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

应用了 css 来显示和隐藏 span，但它不起作用

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>

希望对您有所帮助。