Angular 5 移除特定的 DOM 元素

Vla*_*d N 6 javascript jquery typescript angular angular5

我有一个小问题,我不知道该怎么做。我只是在学习 Angular/Typescript,我不知道如何删除一些 DOM 元素。我有一些自动生成的内容,具有特定的 CSS 类。不幸的是,这些对象是在其他地方生成的,我无法以任何方式配置它们,因此我无法在该内容上添加任何 ngIf 或其他任何内容,这将简化我的工作......我只需要使用它们。我想要实现的是这样的(jQuery 版本):

$("#button").click(function() {
    $('.fc-oss').toggle();
 });
Run Code Online (Sandbox Code Playgroud)

我有一个开关,我想给它附加一个事件,当它被激活时,它会从视图中隐藏/显示具有该特定类型的所有元素。我试图在没有 jQuery 的情况下以 angular 实现这一点,但收效甚微。关于我如何能够实现这一目标的任何想法?

Vad*_*imB 4

在 Angular 中,您可以直接访问文档。

import { Inject, Injectable } from '@angular/core';
import { DOCUMENT } from '@angular/platform-browser';

@Injectable()
export class MyService {
  constructor(@Inject(DOCUMENT) private document: any) {}
}
Run Code Online (Sandbox Code Playgroud)

有了这个,您就可以访问您的元素并为其定义一些逻辑

let element = this.document.getElementbyClassName('fc-oss');
element.style.display = element.style.display === 'none' ? 'block' : 'none';
Run Code Online (Sandbox Code Playgroud)