在Angular中,使用原生的JavaScript方法getElementsByClassName
来选择元素是不推荐的。相反,建议使用Angular的视图查询器或Renderer2
服务来选择和操作DOM元素。
下面是一个解决方法,使用Angular的视图查询器来选择具有特定类名的元素,并获取其长度:
ViewChild
和ElementRef
:import { Component, ViewChild, ElementRef } from '@angular/core';
ElementRef
来引用该元素:@Component({
selector: 'app-your-component',
template: `
Element 1
Element 2
Element 3
`
})
export class YourComponent {
@ViewChild('yourClassElements', { read: ElementRef }) yourClassElements: ElementRef;
}
ref
属性为视图查询器指定一个引用名,并使用该引用名作为参数来获取元素的长度:Element 1
Element 2
Element 3
Number of elements with 'your-class': {{ yourClassElements.nativeElement.length }}
这样,你就可以通过视图查询器获取具有特定类名的元素,并获取其长度,而不使用getElementsByClassName
方法。