在Angular 9中，如何在给定时间只允许div中的一个切换处于活动状态？

在Angular 9中，可以通过使用ngClass指令和条件语句来实现在给定时间只允许一个div处于活动状态的效果。

首先，在组件的HTML模板中，给每个需要切换活动状态的div添加一个唯一的标识符，例如id或class。然后，使用ngClass指令将一个变量与这些div的标识符进行绑定，用于控制它们的活动状态。

接下来，在组件的Typescript文件中，定义一个变量来表示当前活动的div的标识符。在需要切换活动状态的时候，更新这个变量的值。

最后，在ngClass指令中使用条件语句，根据当前活动的div的标识符来判断是否添加活动状态的CSS类。只有与当前活动的div的标识符匹配的div才会被添加活动状态的CSS类，其他div则不会。

以下是一个示例代码：

HTML模板：

<div [ngClass]="{'active': activeDiv === 'div1'}" id="div1">Div 1</div>
<div [ngClass]="{'active': activeDiv === 'div2'}" id="div2">Div 2</div>
<div [ngClass]="{'active': activeDiv === 'div3'}" id="div3">Div 3</div>

Typescript文件：

export class AppComponent {
  activeDiv: string = 'div1'; // 初始状态下，div1处于活动状态

  // 在需要切换活动状态的时候调用该方法
  setActiveDiv(divId: string) {
    this.activeDiv = divId;
  }
}

CSS样式：

.active {
  background-color: yellow;
}

在上述示例中，activeDiv变量表示当前活动的div的标识符。通过调用setActiveDiv方法并传入相应的div标识符，可以切换活动状态。

请注意，示例中的CSS样式只是一个简单的示例，你可以根据实际需求自定义活动状态的样式。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）和腾讯云云数据库MySQL。

腾讯云云服务器（CVM）：提供可扩展的计算容量，帮助用户构建和扩展应用程序。了解更多信息，请访问：腾讯云云服务器（CVM）产品介绍

腾讯云云数据库MySQL：提供高性能、可扩展、可靠的关系型数据库服务。了解更多信息，请访问：腾讯云云数据库MySQL产品介绍