string interpolation in angular 2 /4

Question

how to use a variable multicolors defined in typescript file in our template ?: -

I have tried like this -webkit-linear-gradient(135deg, {{multicolors}} 50%, lightgray 50%) but not working , any solution?

Can you add more code? Where do you write it?

yurzui
– yurzui

2017-08-02 20:18:15 +00:00
Commented Aug 2, 2017 at 20:18 — yurzui
– yurzui, Commented Aug 2, 2017 at 20:18

yurzui · Accepted Answer · 2017-08-02 20:27:30Z

1

I would create pipe like:

@Pipe({ name: 'safeStyle' })
export class SafeStylePipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}
  transform(style) {
    return this.sanitizer.bypassSecurityTrustStyle(style);
  }
}

and then use it as follows

<div [style.background]="'-webkit-linear-gradient(135deg, ' + multicolors + ' 50%, lightgray 50%)' | safeStyle">
  Test
</div>

Plunker Example

Collectives™ on Stack Overflow

string interpolation in angular 2 /4

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related