要解决这个问题,你需要在点击下一个按钮后,手动移除active类。你可以使用Angular的ViewChild装饰器来获取对应的DOM元素,并在点击下一个按钮时,调用removeAttribute方法来移除active类。
以下是一个示例代码:
HTML模板:
这是一个示例元素
组件代码:
import { Component, ViewChild, ElementRef } from '@angular/core';
@Component({
selector: 'app-example',
templateUrl: './example.component.html',
styleUrls: ['./example.component.css']
})
export class ExampleComponent {
@ViewChild('myElement') myElement!: ElementRef;
removeActiveClass() {
this.myElement.nativeElement.removeAttribute('class');
}
}
在上述示例中,我们使用ViewChild装饰器来获取带有"myElement"标识的DOM元素,并在组件中定义了名为"removeActiveClass"的方法。当点击下一个按钮时,该方法会调用myElement.nativeElement.removeAttribute('class')来移除active类。
请注意,使用ViewChild装饰器获取的元素是原生的DOM元素,因此可以使用原生JavaScript的方法来操作DOM。在这个示例中,我们使用removeAttribute方法来移除class属性。