- We mentioned that all our component styles are appended to the document head, but usually would end up in the component’s template, in case we use native Shadow DOM.
- Whenever we create a component, Angular puts it’s template into a , which is the Shadow DOM of that particular component.
- We talked about that in a more detail in styling Angular components, but to make a quick recap, having a zippy component with styles like this (note that we set the property in our decorator):
And a template like this:
Will make Angular creating a DOM like this:
Again, this is due to the fact that there’s no Shadow DOM.
- If there was Shadow DOM, Angular could just write all the styles into the which will enable style encapsulation.
- Since there’s no Shadow DOM, Angular has to write the styles to the head of the document.
Who do you think would find this useful? View Encapsulation in Angular 2 > https://t.co/LPi7fCru6E
— AngularJS News (@AngularJS_News) July 30, 2017
Tweets by ebidel
Tweets by PascalPrecht
Tweets by timche_
Tweets by tim_hartmann_