title: Using Renderer.animate in Angular 2 App
body: <p>NOTE: "Note: Renderer can still be injected/used, but is deprecated."
  <a href="https://github.com/angular/angular/blob/master/CHANGELOG.md" rel="nofollow noreferrer">Change Log</a></p>
  
  <p>Binding variables to the new Animations DSL isn't available and I have been looking for alternatives.</p>
  
  <p>The only one I have found so far is the Renderer.animate function but I have not been able to get it working or find any examples for it.</p>
  
  <p>Looking at the code I found that it uses the following parameters.</p>
  
  <pre><code>renderer.animate(
      element: any, 
      startingStyles: AnimateStyles, 
      keyframes: AnimiationKeyframe[], 
      duration: number, 
      delay: number, 
      easing: string
  ): AnimationPlayer
  </code></pre>
  
  <p>What I got (not working): </p>
  
  <pre><code>renderer.animate(
    element,
    {'opacity': this.temp},
    [
        {'opacity' : .5},
        {'opacity' : 1}
    ],
    2,
    1,
    'linear'
  )
  </code></pre>
  
  <p>What would be the correct way to get this working? Any help would be appreciated.</p>
  
  <p>Thanks</p>