如何在Angular中创建全局ngClass方法？

import { Injectable, Renderer2, RendererFactory2 } from '@angular/core';

@Injectable({
  providedIn: 'root'
})
export class GlobalNgClassService {
  private renderer: Renderer2;

  constructor(private rendererFactory: RendererFactory2) {
    this.renderer = this.rendererFactory.createRenderer(null, null);
  }

  applyNgClass(element: any, ngClassStyles: any): void {
    const classList = Object.entries(ngClassStyles)
      .filter(([key, value]) => value)
      .map(([key, value]) => key)
      .join(' ');

    this.renderer.addClass(element, classList);
  }
}

import { Component, ElementRef, OnInit } from '@angular/core';
import { GlobalNgClassService } from '路径/GlobalNgClassService';

@Component({
  selector: 'app-your-component',
  template: `
    <div #targetElement></div>
  `
})
export class YourComponent implements OnInit {
  @ViewChild('targetElement', { static: true }) targetElementRef: ElementRef;

  constructor(private globalNgClassService: GlobalNgClassService) {}

  ngOnInit(): void {
    const targetElement = this.targetElementRef.nativeElement;
    const ngClassStyles = {
      'class1': true,
      'class2': false,
      'class3': true
    };

    this.globalNgClassService.applyNgClass(targetElement, ngClassStyles);
  }
}