CODEWITHSUNDEEP
cssangular
qkhanhpro
qkhanhpro

Reputation: 5240

Angular: Inject CSS from parent to child component

Currently I'm trying to create one Angular Element

To make the Element/Component reusable elsewhere, we need to somehow let parent/host component decide style for the Angular Element i'm working on

I already read some StackOverflow material which lead me to believe all the ways are deprecated at the moment

I think this is what we can do at the moment

<host-element>
      <my-element [getStyle] = "getStyleFnFromHost"> </my-element>
</host-element>

I don't feel like this is a good approach, however.

So what do you think I should do at the moment?

Edit: I would like to clarify that the difference from my question to the question that I refer to is that: I would like to find a good way inject CSS/Style from the parent element to the child element. That does not necessarily involves cascading CSS from parent to Child elements

Upvotes: 0

Views: 263

Answers (1)

Jens Habegger
Jens Habegger

Reputation: 5446

As described in the answer you referenced, the ::ng-deep piercing combinator is still the only way to do what you're asking. Yes, it will very likely be deprecated in the future, but only if and when an appropriate alternative is available (which is not yet the case).

From the Angular docs (highlights by me):

The shadow-piercing descendant combinator is deprecated and support is being removed from major browsers and tools. As such we plan to drop support in Angular (for all 3 of /deep/, >>> and ::ng-deep). Until then ::ng-deep should be preferred for a broader compatibility with the tools.

Upvotes: 1

Related Questions