angular-如何隐藏一个元素并使用ng-blur显示另一个元素？

在Angular中，可以使用ngIf指令来隐藏和显示元素，并使用ngBlur指令来监听元素失去焦点事件。

首先，确保你已经在Angular项目中引入了FormsModule，以便使用ngModel和ngIf指令。

接下来，你可以在HTML模板中使用ngIf指令来根据条件隐藏和显示元素。例如，你可以创建两个元素，一个用于显示，另一个用于隐藏，并使用ngIf指令设置它们的显示条件。

<div *ngIf="showElement">
  <!-- 显示的元素 -->
</div>

<div *ngIf="!showElement">
  <!-- 隐藏的元素 -->
</div>

在组件的类中，你可以定义一个布尔类型的变量showElement，并在需要的时候改变它的值来控制元素的显示和隐藏。

export class YourComponent {
  showElement: boolean = true;

  toggleElement() {
    this.showElement = !this.showElement;
  }
}

在上面的例子中，showElement的初始值为true，所以显示的元素会被渲染出来。当调用toggleElement方法时，showElement的值会被取反，从而隐藏显示的元素并显示隐藏的元素。

如果你想在元素失去焦点时显示另一个元素，可以使用ngBlur指令来监听元素的失去焦点事件，并在事件触发时改变showElement的值。

<input (blur)="toggleElement()" />

<div *ngIf="!showElement">
  <!-- 需要显示的元素 -->
</div>

在上面的例子中，当输入框失去焦点时，toggleElement方法会被调用，从而隐藏输入框并显示需要显示的元素。