How to bind ngStyle to ng-conent in angular2

Question

I try to bind ngStyle to ng-content, it doesn't work, see below example:

<ng-content select="panel-one" [ngStyle]="{'width':size+'px'}"></ng-content>

I search on internet only find below solution,

::content >>> panel-one {width:50px}

but it can not dynamic change the style value.

score 1 · Answer 1 · answered Jul 26 '16 at 10:31

<ng-content> is never added to the DOM. It's just an internal placeholder for Angular2. The [ngStyle] doesn't have any effect at all.

Maybe using a wrapper does what you want

  <div [ngStyle]="{'width':size+'px'}">
    <ng-content select="panel-one" ></ng-content>
  </div>

1 Answers1