ngStyle object expression multiple values for property angular 2

Question

Is it possible to add multiple values to property in ngStyle directive? like for example:

<div [ngStyle]='{"background" : ["rgba(248,80,50,1)", "-webkit-gradient(left top, right top, color-stop(0%, rgba(248,80,50,1)), color-stop(50%, rgba(241,111,92,1)), color-stop(51%, rgba(246,41,12,1)), color-stop(71%, rgba(240,47,23,1)), color-stop(100%, rgba(231,56,39,1)))"]}' ></div>

Thanks

Mickers · Accepted Answer · 2016-11-10 18:30:57Z

1

In this example couldn't you just use a custom class? In your component definition you can include a unique stylesheet for that particular component with styleUrls. Example:

@Component({
selector: 'my-component',
moduleId: module.id,
templateUrl: 'my-component.html',
styleUrls: ['my-component.css'] // <-- here
})

Another way it might be easier to use ngClass if you need to toggle different styles as well.

answered Nov 10, 2016 at 18:30

Mickers

1,4492 gold badges21 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Emmanuel Villegas Over a year ago

thanks for your replay, i need to load the styles dinamically, so i think the ngClass directive can´t do that, same with stylesUrl.

Mickers Over a year ago

I see. I didn't grasp that from your example. I did find an example of how to do it with Angular 1. Perhaps you can translate it to Angular 2 to do what you want. Hope that helps.

Collectives™ on Stack Overflow

ngStyle object expression multiple values for property angular 2

1 Answer 1

2 Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Linked

Related