1

I have a component library that I've designed for lets say theme A. I want to have most of the components with a slight different variation (in both template and css) in them to make my theme B.

I've taken a look at most of these questions on SO and also on the web but nothing addresses my issue precisely unless I create a new tag with a different name which I don't believe to be an elegant way to address this issue.

I would appreciate if someone can provide me an approach to tackle this.

How to apply themes in angular2?

Can I add two template for one component in angular2?

Angular 2 component with multiple views

lealceldeiro
  • 14,342
  • 6
  • 49
  • 80
saNiks
  • 744
  • 5
  • 15

2 Answers2

0

Not sure about first two questions.

For "Angular 2 component with multiple views": Angular is all about composing views. So, you can use content-projection using "" tag to insert different content inside the existing component. You can control the visibility of these projected content by "ngIf".

Ashish Patel
  • 317
  • 1
  • 8
0

if there are few differences and few themes you can Your css like

.theme1 .head{..}
.theme1 .title{..}
.theme2 .head{..}
...
.theme3 .head{..}
...

your html

<div [ngClass]="themeActual">
<head>..</head>
<div class="title>...</div>

your .ts only need use 

themeActual="theme1";

If there are so many difference you can change index.html importing the theme.css someway

About component with different views, if the problem it's about mobile layout you can use media querys css or *ngIf, ...

Eliseo
  • 50,109
  • 4
  • 29
  • 67