title: Nativescript View.animate( ) not working
body: <p>I'm following <a href="http://docs.nativescript.org/angular/tutorial/ng-chapter-4" rel="nofollow noreferrer">this</a> tutorial from <a href="https://docs.nativescript.org" rel="nofollow noreferrer">nativescript.org</a> for nativescript with angular2.</p>
  
  <p>Where, on tap of a button, I am trying to animate the background of a StackLayout.</p>
  
  <pre><code>  &lt;StackLayout #container&gt;
      &lt;Button [text]="'Some text'" (tap)="toggleDisplay();"&gt;&lt;/Button&gt;
    &lt;/StackLayout&gt;  
  </code></pre>
  
  <p>I'm getting the reference to the <code>StackLayout</code> using <code>@ViewChild</code> decorator.</p>
  
  <p><code>@ViewChild("container") container: ElementRef;</code></p>
  
  <p>The <code>toggleDisplay()</code> function looks like this</p>
  
  <pre><code>  toggleDisplay() {
      this.isLoggingIn = !this.isLoggingIn;
      let container = &lt;View&gt;this.container.nativeElement;
      container.animate({
        backgroundColor: new Color("#301217"),
        duration: 200
      });
    }
  </code></pre>
  
  <p>On click on the button I'm getting runtime exception</p>
  
  <pre><code>An uncaught Exception occurred on "main" thread.
  com.tns.NativeScriptException: 
  Calling js method onClick failed
  [object Object]
  File: "/data/data/org.nativescript.groceries/files/app/tns_modules/@angular/core/bundles/core.umd.js, line: 9427, column: 20
  StackTrace: 
      Frame: function:'DebugAppView._rethrowWithContext', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 9427, column: 21
      Frame: function:'', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 9440, column: 27
      Frame: function:'', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/nativescript-angular/renderer.js', line: 221, column: 26
      Frame: function:'ZoneDelegate.invoke', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js', line: 190, column: 28
      Frame: function:'onInvoke', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 6206, column: 41
      Frame: function:'ZoneDelegate.invoke', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js', line: 189, column: 34
      Frame: function:'Zone.run', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/nativescript-angular/zone.js/dist/zone-nativescript.js', line: 83, column: 43
      Frame: function:'NgZone.run', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/@angular/core/bundles/core.umd.js', line: 6096, column: 66
      Frame: function:'zonedCallback', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/nativescript-angular/renderer.js', line: 220, column: 24
      Frame: function:'Observable.notify', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/data/observable/observable.js', line: 149, column: 23
      Frame: function:'Observable._emit', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/data/observable/observable.js', line: 168, column: 18
      Frame: function:'onClick', file:'/data/data/org.nativescript.groceries/files/app/tns_modules/ui/button/button.js', line: 33, column: 32
  
  at com.tns.Runtime.callJSMethodNative(Native Method)
  at com.tns.Runtime.dispatchCallJSMethodNative(Runtime.java:1022)
  at com.tns.Runtime.callJSMethodImpl(Runtime.java:907)
  at com.tns.Runtime.callJSMethod(Runtime.java:895)
  at com.tns.Runtime.callJSMethod(Runtime.java:879)
  at com.tns.Runtime.callJSMethod(Runtime.java:871)
  at com.tns.gen.android.view.View_OnClickListener.onClick(android.view.View$OnClickListener.java)
  at android.view.View.performClick(View.java:5198)
  at android.view.View$PerformClick.run(View.java:21147)
  at android.os.Handler.handleCallback(Handler.java:739)
  at android.os.Handler.dispatchMessage(Handler.java:95)
  at android.os.Looper.loop(Looper.java:148)
  at android.app.ActivityThread.main(ActivityThread.java:5417)
  at java.lang.reflect.Method.invoke(Native Method)
  at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:726)
  at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:616)
  </code></pre>
  
  <p>I found <a href="https://docs.nativescript.org/cookbook/ui/animation" rel="nofollow noreferrer">here</a> that </p>
  
  <blockquote>
    <p>Animating view properties requires the "ui/animation" module.</p>
  </blockquote>
  
  <pre><code>import animation = require("ui/animation");
  </code></pre>
  
  <p>So in my angular2 app I did</p>
  
  <pre><code>import * as animation from "ui/animation";
  </code></pre>
  
  <p>But still getting the same error.</p>
  
  <p>Also <a href="https://github.com/NativeScript/NativeScript/issues/2077" rel="nofollow noreferrer">here</a> I found out there are some issues with android animations for nativescript. But that doesn't throw any exceptions.</p>
  
  <p>Any help?</p>