How to bind a property to style.width in pixels?
Works fine for me
@Component({ selector: 'my-app', styles: [`div { border: 3px solid red; }`] template: ` <div> <h2>Hello {{name}}</h2> <div [style.width.px]="width">some texts </div> </div> `,})export class App { name:string; width: number = 250; constructor() { this.name = 'Angular2' }}
For pixel unit
<div [style.width.px]="width"> Width Size with px</div>
Or
<div bind-style.width.px="width"> Width Size with px</div>
Other CSS units
<div [style.width.em]="width"> Width Size with em</div><div [style.width.pt]="width"> Width Size with pt</div><div [style.width.%]="width"> Width Size with %</div>
Component
export class MyComponent{ width: number = 80;}