Fixes label overlapping issue when ngModel has value

Author: tilwinjoy

src/scripts/directives/form-control.js

@@ -1,16 +1,14 @@
 angular.module('angularBootstrapMaterial')
   .directive('abmFormControl', ['isChar', function (isChar) {
     return {
-      /*templateUrl: 'templates/input.html',
-    replace: true,*/
       scope: {},
       require: ['ngModel', '^abmFormGroup'],
       compile: function () {
         return function ($scope, $element, attrs, ctrls) {
           var input = ctrls[0];
           var formGroup = ctrls[1];
           if (!$element.hasClass('form-control')) // TBD checkif the condition is unnecessary
-            $element.addClass('form-control')
+            $element.addClass('form-control');
           if (!$element.attr('id')) // TBD checkif the condition is unnecessary
             $element.attr('id', 'form-control-' + $scope.$id);
           formGroup.registerControl($scope);
@@ -23,15 +21,18 @@ angular.module('angularBootstrapMaterial')
             })
             .on('blur', function () {
               formGroup.toggleFocus(false);
-              if ($element.val())
-                formGroup.toggleEmpty(false);
+              formGroup.toggleEmpty($element.val());
             });
 
           $scope.$watch(function () {
             return input.$invalid;
           }, formGroup.toggleError);
-          $scope.$watch(attrs.ngModel, formGroup.toggleEmpty);
+          $scope.$watch(function () {
+            return input.$modelValue;
+          }, function (newValue, oldValue) {
+            formGroup.toggleEmpty(!newValue);
+          });
         }
       }
-    }
+    };
     }]);