angular - Custom Styling on <ng-content> in angular2 not working ? -


i trying style <ng-content> using inline css seems style does't work on ng-content, have else styling ?

<ng-content class="red"></ng-content> <p class="red">hello</p> 

here class red works on p not on

working example

::content ignored.

this comes closes

you can use ::content selector

styles: ['.red {color:red} :host >>> upper {color:green}'] 

or

styles: ['.red {color:red} :host >>> * {color:green}'] 

and if there fellow less users, seems less compiler dislikes >>> syntax, need add alias that, eg. @deep: ~">>>"; , use @{deep} { /* deep styles here */ }

see discussion https://github.com/angular/angular/issues/7400#issuecomment-246922468

can use ::content selector

styles: ['.red {color:red} ::content >>> upper {color:green}'] 

or

styles: ['.red {color:red} ::content >>> * {color:green}'] 

according web components spec ::content should enough , >>> should not required styles not applied without it.

plunker example


Comments

Popular posts from this blog

Export Excel workseet into txt file using vba - (text and numbers with formulas) -

wordpress - (T_ENDFOREACH) php error -

Using django-mptt to get only the categories that have items -