CODEWITHSUNDEEP
javascripthtmlcssangulartypescript
Ole
Ole

Reputation: 47172

Altering the CSS added by an Angular Directive?

How do we override the CSS created by an angular directive. For example when we add the add the sort directive to the material data table it creates this problem (It overrides the layout of the column header)..

Overriding the CSS via styles.scss or the components local CSS, does not work, because the directive adds an inline style which has priority. Also tried adding !important to the CSS definition override, but no love.

Thoughts?

Upvotes: 0

Views: 1608

Answers (2)

dota2pro
dota2pro

Reputation: 7864

You can either use NgStyle or Angular Style Binding if classes' style is not being applied. Best way is to use ngdeep

If this still doesn't work put it on a setTimeout or ngAfterViewChecked (Not recommended tho.).

Upvotes: 1

Thilanka Ishara Gunathilake
Thilanka Ishara Gunathilake

Reputation: 286

I can suggest one method, write a custom CSS class in your component's CSS/SCSS file and apply it using a condition with NgClass directive, execute your condition within onInit.

just try and see, I hope it'll work

Upvotes: 1

Related Questions