title: Angular 2 dynamic values in animation
body: <p>I've just recently started messing around with Ng2 and I'm now developing an app with ionic2.
  I'm digging into the animation part for the first time and I've ran into some issues.</p>
  
  <p>I have a ngFor that basically repeats s with different widths. Each element in the array has it's own div's width value which is calculated the component's onInit method. Before the animations I was binding the width via <code>[style.width]="expresson"</code>. The docs say you can define an animation end state style with '*' which means it'll get the right value from the computed style, but that doesn't work when I'm programatically setting the width myself.</p>
  
  <p>So, question is, how can I tell the animation to either trigger when I change the width, or to dynamically set the value for the end state?
  Thanks!</p>
  
  <p>EDIT: Here's a <a href="https://plnkr.co/edit/XkYqMlUvZoD4ggL5MbVf?p=preview" rel="noreferrer">plunkr</a> with an example. I set the final width after animating to 50%, but what I'm having trouble is setting that final width to the values defined in the component's array. Just remove the @animation in the html to see the final result I'd like to get.</p>