在您的 .ts 文件中定义一些布尔变量，例如 someFlag

然后在 html 中使用 *ngIf=someFlag

结果将是 - 只有当这个变量为真时，div 才会显示，否则将被隐藏。

示例：

example.ts

export class Example {
  ...
  someFlag:boolean = true;
  ...
}

example.html

<div id="parent"
      (focusin)="this.someFlag=true" (focusout)="this.someFlag=false">

   <div *ngIf=this.someFlag">
      <p>bla bla...</p>
   </div>

</div>

如果焦点是指悬停，那么 基本上你想在悬停时隐藏 blue_dashboard 图像

html：

<div class="sidebarBlock"  tabindex="-1" >
    <div class="blue">
        <img src="../../../assets/icons/blue_dashboard.png" class="iconstyle" >
        <span class="iconText">Dashborad</span>
     </div>
    <div>
       <img src="../../../assets/icons/dashboard.png" class="iconstyle" >
       <span class="iconText">Dashborad</span>
    </div>
</div>

CSS：

.sidebarBlock:not(:hover) .blue {
  display: none
}

您可以使用 .ts 文件中的 formControl 来完成。

在 HTML 中，您可以使用 *ngIf="parentFormControlName.focus"