What are the ways to add conditional css file in Angular

Question

How can we apply css files or import css files conditionally in angular.

Note: We should have multiple css files and on condition it should apply the css file to the angular component.

In how many ways can we achieve it? any approach could be usable.

What type of conditions? (Typically you would conditionally apply CSS styling based on a class that you set conditionally.) — Remi, Nov 10 '21 at 08:07
The Condition is on getting URL Params value we should apply the correct css file like url params value is red then red.css file should be imported or used. — Eswar Sai Pallapolu, Nov 10 '21 at 08:12
Got it. This might be what you're looking for: https://stackoverflow.com/questions/58553876/angular-2-how-to-dynamically-change-an-entire-css-stylesheet-based-on-url-quer — Remi, Nov 10 '21 at 08:14
Does this answer your question? [Angular 2 - How to dynamically change an entire CSS stylesheet based on URL queryparams](https://stackoverflow.com/questions/58553876/angular-2-how-to-dynamically-change-an-entire-css-stylesheet-based-on-url-quer) — Remi, Nov 10 '21 at 08:21

score 0 · Accepted Answer · answered Nov 10 '21 at 08:12

0

You can use ngClass directive:

<div id="mydiv" [ngClass]="{'myCSSclass' : condition}"></div>

answered Nov 10 '21 at 08:12

Baruch Mashasha

enjoy @EswarSaiPallapolu – Baruch Mashasha Nov 10 '21 at 08:28
@EswarSaiPallapolu the answer was not enough for you? – Baruch Mashasha Nov 10 '21 at 10:26

1 Answers1