[英]Angular 5 remove specific DOM elements
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.
我只是在学习Angular / Typescript,我无法弄清楚如何删除一些DOM元素。 I have some auto generated content, that has specific CSS classes.
我有一些自动生成的内容,具有特定的CSS类。 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.
不幸的是,对象是在其他地方生成的,我无法以任何方式配置它们,因此我无法在该内容上添加任何ngIf或其他内容,这将简化我的工作......我只需要使用它们。 What I want to achieve is something like this( jQuery version):
我想要实现的是这样的(jQuery版本):
$("#button").click(function() {
$('.fc-oss').toggle();
});
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.
我试图在没有jQuery但没有成功的角度实现这一点。 Any ideas on how I might be able to achieve this ?
关于我如何能够实现这一目标的任何想法?
您可以使用*ngIf="boleanVar"
,在您的ts中使用'boleanVar = true'
初始化它并添加<br>< button (click)="boleanVar = !boleanVar"> Toggle visibility</button>
In Angular you can use direct access to DOCUMENT. 在Angular中,您可以使用直接访问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';
You can use the ngif directive for that. 您可以使用ngif指令。
@Component({
selector: 'ng-if-simple',
template: `
<button (click)="show = !show">{{show ? 'hide' : 'show'}}</button>
show = {{show}}
<br>
<div *ngIf="show">Text to show</div>
`
})
class NgIfSimple {
show: boolean = true;
}
According to the value of the variable show
the div element will toggle view. 根据变量的值
show
div元素将切换视图。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.