在Angular中,可以通过以下步骤来删除先前选择的列表项的活动类:
<ul>
<li [ngClass]="{'active': selectedItem === item}" *ngFor="let item of items" (click)="selectItem(item)">
{{ item }}
</li>
</ul>
在上述代码中,selectedItem
表示当前选择的列表项,items
是列表项的数组。当selectedItem
与当前遍历的列表项相等时,会添加名为"active"的活动类。
selectedItem
变量,并实现selectItem
方法来更新selectedItem
的值。示例代码如下:export class YourComponent {
selectedItem: any;
items: any[] = ['Item 1', 'Item 2', 'Item 3'];
selectItem(item: any): void {
this.selectedItem = item;
}
}
在上述代码中,selectedItem
变量用于存储当前选择的列表项。selectItem
方法用于更新selectedItem
的值为用户选择的列表项。
通过以上步骤,当用户选择新的列表项时,先前选择的列表项会自动移除活动类,新选择的列表项会添加活动类。这样可以实现在Angular中选择新的列表项时删除先前选择的列表项的活动类的功能。
推荐的腾讯云相关产品:腾讯云云服务器(CVM)和腾讯云云数据库MySQL。
领取专属 10元无门槛券
手把手带您无忧上云