Question

我有一个第三方库，我无法控制修改源代码，我想在该库生成的DOM元素上添加/删除css类。

由于我无权访问源代码，因此无法按照Angular的建议添加类。因此，我的问题是实现此目标的推荐方法是什么。

例如，在DOM上给出此示例（使其易于理解）：

    <custom-control>
        <div class='one'>
        </div>
    </custom-control>

我已经通过以下方法完成了我所需要的：

首先在我的组件的构造函数中注入ElementRef：

    private myElement: ElementRef

然后使用querySelector获取元素并添加我想要的类：

    const ele = this.myElement.nativeElement.querySelector('.one');
    ele.classList.add('two');

在此示例中，将产生：

    <custom-control>
        <div class='one two'>
        </div>
    </custom-control>

稍后（基于某种逻辑），我需要删除我添加的类：

    ele.classList.remove('two');

注意：我无权访问第三方代码，我该如何完成角度推荐的方式？

Answer 1

您可以在样式文件中使用:: ng-deep选择器。

::ng-deep <class-name> {
    <property>: <value>
}

示例：

::ng-deep .one {
    color: blue;
}

的更多信息