fix(input): correct initial animation state of messages

With commit cf7f21a, animations were moved to input.js in response to an ng-enter
flicker issue with Angular 1.4.x. While the flicker was fixed, new animation bugs
arised. Angular 1.4.x added and backported a ng-enter-prepare to avoid this bug.

* Use `.ng-enter-prepare` to avoid flicker on Angular 1.4+
* Use `.ng-enter:not(.ng-enter-active)` to prepare animations on 1.3 and below

Fixes #6767, #9543, #9723, #10240

Related: angular/angular.js#13408

Author: clshortfuse

src/components/input/input-animations.spec.js

@@ -345,4 +345,4 @@ describe('md-input-container animations', function() {
 
     el && el.remove && el.remove();
   }
-});
+});

src/components/input/input.js

@@ -1077,4 +1077,4 @@ function saveSharedServices(_$$AnimateRunner_, _$animateCss_, _$mdUtil_, _$log_)
   $animateCss = _$animateCss_;
   $mdUtil = _$mdUtil_;
   $log = _$log_;
-}
+}

src/components/input/input.scss

@@ -219,13 +219,6 @@ md-input-container {
     overflow: hidden;
     @include rtl(clear, left, right);
 
-    &.ng-enter {
-      // Upon entering the DOM, messages should be hidden
-      .md-input-message-animation {
-        opacity: 0;
-        margin-top: -100px;
-      }
-    }
   }
 
   .md-input-message-animation, .md-char-counter {
@@ -259,16 +252,16 @@ md-input-container {
     }
   }
 
-  // Note: This is a workaround to fix an ng-enter flicker bug
   .md-input-message-animation {
-    &:not(.ng-animate) {
+    // Enter animation
+    // Pre-animation state is transparent and off target
+    &.ng-enter-prepare {
       opacity: 0;
       margin-top: -100px;
     }
-  }
 
-  .md-input-message-animation {
-    &.ng-enter {
+    // First keyframe of entry animation
+    &.ng-enter:not(.ng-enter-active) {
       opacity: 0;
       margin-top: -100px;
     }