import css based on condition in styles.css angular 7











up vote
0
down vote

favorite
1












How to import css based on condition like below,



Angular7



In styles.css



if (data === 'mobile') {

  @import './assets/css/common1.css'; 

} else {

  @import './assets/css/common2.css'; 

}


My problem is:



I have two modules which loads different application in my project.



{

  path : ''

  loadChildren: Module1

}



{

  path : 'ng7'

  loadChildren: Module2

}


Here, I want to use Module 1 - common1.css and Module 2 - common2.css






angular angular7







share|improve this question
























  • try stackoverflow.com/questions/42824472/…
    – Alok Deshwal
    Nov 10 at 16:20






  • 1




    Possible duplicate of angular2: how to manually add css files by condition to index.html?
    – SiddAjmera
    Nov 10 at 16:25










  • No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
    – Satzz
    Nov 10 at 16:26










  • Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
    – Satzz
    Nov 10 at 16:28










  • If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
    – Aparna
    Nov 10 at 17:38

















up vote
0
down vote

favorite
1












How to import css based on condition like below,



Angular7



In styles.css



if (data === 'mobile') {

  @import './assets/css/common1.css'; 

} else {

  @import './assets/css/common2.css'; 

}


My problem is:



I have two modules which loads different application in my project.



{

  path : ''

  loadChildren: Module1

}



{

  path : 'ng7'

  loadChildren: Module2

}


Here, I want to use Module 1 - common1.css and Module 2 - common2.css






angular angular7







share|improve this question
























  • try stackoverflow.com/questions/42824472/…
    – Alok Deshwal
    Nov 10 at 16:20






  • 1




    Possible duplicate of angular2: how to manually add css files by condition to index.html?
    – SiddAjmera
    Nov 10 at 16:25










  • No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
    – Satzz
    Nov 10 at 16:26










  • Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
    – Satzz
    Nov 10 at 16:28










  • If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
    – Aparna
    Nov 10 at 17:38















up vote
0
down vote

favorite
1









up vote
0
down vote

favorite
1






1





How to import css based on condition like below,



Angular7



In styles.css



if (data === 'mobile') {

  @import './assets/css/common1.css'; 

} else {

  @import './assets/css/common2.css'; 

}


My problem is:



I have two modules which loads different application in my project.



{

  path : ''

  loadChildren: Module1

}



{

  path : 'ng7'

  loadChildren: Module2

}


Here, I want to use Module 1 - common1.css and Module 2 - common2.css






angular angular7







share|improve this question















How to import css based on condition like below,



Angular7



In styles.css



if (data === 'mobile') {

  @import './assets/css/common1.css'; 

} else {

  @import './assets/css/common2.css'; 

}


My problem is:



I have two modules which loads different application in my project.



{

  path : ''

  loadChildren: Module1

}



{

  path : 'ng7'

  loadChildren: Module2

}


Here, I want to use Module 1 - common1.css and Module 2 - common2.css






angular angular7




angular angular7






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 10 at 17:14









HDJEMAI

4,051123653




4,051123653










asked Nov 10 at 16:13









Satzz

276




276












  • try stackoverflow.com/questions/42824472/…
    – Alok Deshwal
    Nov 10 at 16:20






  • 1




    Possible duplicate of angular2: how to manually add css files by condition to index.html?
    – SiddAjmera
    Nov 10 at 16:25










  • No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
    – Satzz
    Nov 10 at 16:26










  • Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
    – Satzz
    Nov 10 at 16:28










  • If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
    – Aparna
    Nov 10 at 17:38




















  • try stackoverflow.com/questions/42824472/…
    – Alok Deshwal
    Nov 10 at 16:20






  • 1




    Possible duplicate of angular2: how to manually add css files by condition to index.html?
    – SiddAjmera
    Nov 10 at 16:25










  • No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
    – Satzz
    Nov 10 at 16:26










  • Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
    – Satzz
    Nov 10 at 16:28










  • If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
    – Aparna
    Nov 10 at 17:38


















try stackoverflow.com/questions/42824472/…
– Alok Deshwal
Nov 10 at 16:20




try stackoverflow.com/questions/42824472/…
– Alok Deshwal
Nov 10 at 16:20




1




1




Possible duplicate of angular2: how to manually add css files by condition to index.html?
– SiddAjmera
Nov 10 at 16:25




Possible duplicate of angular2: how to manually add css files by condition to index.html?
– SiddAjmera
Nov 10 at 16:25












No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
– Satzz
Nov 10 at 16:26




No Alok Deshwal. I tried . But my problem is to add only one css based on condition.
– Satzz
Nov 10 at 16:26












Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
– Satzz
Nov 10 at 16:28




Sceanrio: module1 need to load common1.css and module2 need to load common2.css. These 2 different application in my project
– Satzz
Nov 10 at 16:28












If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
– Aparna
Nov 10 at 17:38






If you are loading the modules dynamically, then add css files using "styleUrls" to the associated components of module.
– Aparna
Nov 10 at 17:38



















active

oldest

votes











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














 

draft saved


draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53240852%2fimport-css-based-on-condition-in-styles-css-angular-7%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown






























active

oldest

votes













active

oldest

votes









active

oldest

votes






active

oldest

votes
















 

draft saved


draft discarded



















































 


draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53240852%2fimport-css-based-on-condition-in-styles-css-angular-7%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







-

Popular posts from this blog

Florida Star v. B. J. F.

Image
Florida Star v. B. J. F. From Wikipedia, the free encyclopedia Jump to navigation Jump to search United States Supreme Court case Florida Star v. B. J. F. Supreme Court of the United States Argued March 21, 1989 Decided June 21, 1989 Full case name The Florida Star v. B. J. F. Citations 491 U.S. 524 ( more ) 109 S. Ct. 2603; 105 L. Ed. 2d 443; 1989 U.S. LEXIS 3120; 57 U.S.L.W. 4816; 16 Media L. Rep. 1801 Prior history The Florida Star v. B.J.F., 530 So.2d 286 (1988) Supreme Court of Florida; Florida Star v. B.J.F., 499 So.2d 883 (1986) Fla. Dist. Court of Appeals Holding Florida Stat. § 794.03 is unconstitutional to the extent it makes the truthful reporting of information that was a matter of public record unlawful, as it violates the First Amendment. Court membership Chief Justice William Rehnquist Associate Justices William J. Brennan Jr.  · Byron White Thurgood Marshall  · Harry Blac
Read more

Error while running script in elastic search , gateway timeout

Image
0 while running script in elastic search, I got 504 Gateway timeout error. { "query": { "bool": { "filter": { "script": { "script": " doc['creted_date'].date.getMonthOfYear() == 12 " } } } }, "aggs": { "test": { "date_histogram": { "field": "creted_date", "interval": "month", "format": "MMM" }, "aggs": { "cost": { "sum": { "field": "cost" } } }
Read more

Adding quotations to stringified JSON object values

Image
0 My stringified object data doesn't include quotation marks around object values, which errors when attempting JSON.parse() : '{ "affiliation": CORPORATE, "userId": 75c35d1c-5d12-4485-8fa8-b2f1551a3e6e }' I need the string to be: '{ "affiliation": "CORPORATE", "userId": "75c35d1c-5d12-4485-8fa8-b2f1551a3e6e" }' I'm using this regex to add quotes to the object keys: var newStr = str.replace(/(['"])?([a-z0-9A-Z_]+)(['"])?:/g, '"$2": '); For instance: '{ affiliation: CORPORATE }' to '{ "affiliation": CORPORATE }' There are only string values in my data, so I don't need to check value types. How can I alter my regex expression to add quotations to
Read more