Angular 5 移除特定的 DOM 元素 [英] Angular 5 remove specific DOM elements

查看:18
本文介绍了Angular 5 移除特定的 DOM 元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

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

I have a small issue that I can't figure out how to do. I am just learning Angular / Typescript and I can't figure out how I could remove some DOM elements. I have some auto generated content, that has specific CSS classes. Unfortunately The objects are generated somewhere else and I cannot configure them in any way so I cannot add any ngIf or anything else on that content, that would simplify my work... I just have to use them. What I want to achieve is something like this( jQuery version):

$("#button").click(function() {
    $('.fc-oss').toggle();
 });

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

I have a toggle and I want to attach an event to it that when it's being activated, it hides/ shows all elements with that specific type from the view. I am trying to achieve this in angular without jQuery but with little success. Any ideas on how I might be able to achieve this ?

推荐答案

在 Angular 中,您可以直接访问 DOCUMENT.

In Angular you can use direct access to DOCUMENT.

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

@Injectable()
export class MyService {
  constructor(@Inject(DOCUMENT) private document: any) {}
}

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

Having this you can access your element and define some logic to it

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

这篇关于Angular 5 移除特定的 DOM 元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆