Angular 8在多个地方的单击事件上生成c.querySelectorAll不是一个函数

在Angular 8中，如果你遇到了c.querySelectorAll不是一个函数的问题，这通常是因为c不是一个DOM元素，而可能是一个组件实例或者其他类型的对象。在Angular中，我们通常不直接操作DOM，而是通过模板引用变量或者ViewChild装饰器来获取DOM元素的引用。

基础概念

模板引用变量：在HTML模板中，你可以使用#variableName来创建一个模板引用变量，它指向特定的DOM元素或Angular指令。
ViewChild装饰器：这是一个Angular装饰器，用于在组件类中获取模板中的元素或指令的引用。

解决方法

如果你需要在组件中获取DOM元素的引用并使用querySelectorAll，你应该确保你获取的是一个DOM元素。以下是使用模板引用变量和ViewChild装饰器的示例。

使用模板引用变量

在你的HTML模板中：

<div #myDiv>...</div>

在你的组件类中：

import { Component, ElementRef, ViewChild } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
})
export class MyComponent {
  @ViewChild('myDiv') myDiv: ElementRef;

  ngAfterViewInit() {
    const elements = this.myDiv.nativeElement.querySelectorAll('.some-class');
    // 现在你可以使用elements了
  }
}

使用ViewChild装饰器

在你的HTML模板中：

<div #myDiv>...</div>

在你的组件类中：

import { Component, ViewChild, ElementRef } from '@angular/core';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
})
export class MyComponent {
  @ViewChild('myDiv', { static: false }) myDiv: ElementRef;

  ngAfterViewInit() {
    if (this.myDiv) {
      const elements = this.myDiv.nativeElement.querySelectorAll('.some-class');
      // 使用elements进行操作
    }
  }
}