aspa en inputs

client/core/src/textfield/style.css

@@ -0,0 +1,11 @@
+.mdl-chip__action{
+    position: absolute; 
+    top: 0px; 
+    right: -6px; 
+    margin: 22px 0px; 
+    visibility: hidden;
+}
+
+.material-icons{
+    font-size: 18px;    
+}

client/core/src/textfield/textfield.js

@@ -2,12 +2,13 @@ import {module as _module} from '../module';
 import * as resolveFactory from '../lib/resolveDefaultComponents';
 import * as normalizerFactory from '../lib/inputAttrsNormalizer';
 import * as util from '../lib/util';
+require('./style.css');
 
 const _NAME = 'textfield';
 export const NAME = util.getName(_NAME);
 
-directive.$inject = [resolveFactory.NAME, normalizerFactory.NAME];
-export function directive(resolve, normalizer) {
+directive.$inject = [resolveFactory.NAME, normalizerFactory.NAME, '$parse'];
+export function directive(resolve, normalizer, $parse) {
     return {
         restrict: 'E',
         template: function(_, attrs) {
@@ -21,6 +22,36 @@ export function directive(resolve, normalizer) {
                     mdlField.updateClasses_();
             });
             componentHandler.upgradeElement(element[0].firstChild);
+            
+            scope.clickClear = function(model) {
+                setTimeout(() => {
+                    scope.$apply(function() {
+                        $parse(model).assign(scope, "");
+                    });
+                });
+            };
+            scope.onFocusInput = function(model, event) {
+                var buttonClear = event.target.parentNode.querySelector("button");
+                checkModelValue(buttonClear, model);
+            };
+            scope.onBlurInput = function(event) {
+                var buttonClear = event.target.parentNode.querySelector("button");
+                setTimeout(() => {
+                    buttonClear.style.visibility = "hidden";
+                }, 80);
+            };
+            element.on('input', function() {
+                var buttonClear = this.querySelector("button");
+                var model = this.querySelector("input").value;
+                checkModelValue(buttonClear, model);
+            });
+
+            function checkModelValue(buttonClear, model) {
+                if (model !== undefined && model !== "")
+                    buttonClear.style.visibility = "visible";
+                else
+                    buttonClear.style.visibility = "hidden";
+            }
         }
     };
 }

client/core/src/textfield/textfield.mdl.html

@@ -5,6 +5,12 @@
 		name="*[name]*"
 		ng-model="*[model]*"
 		vn-validation="*[rule]*"
-		*[enabled]*/>
+		*[enabled]*
+		ng-focus="onFocusInput(*[model]*, $event)"
+		ng-blur="onBlurInput($event)"
+		/>
+	<button type="button" class="mdl-chip__action" ng-click="clickClear('*[model]*')"> 
+        <i class="material-icons">cancel</i>
+    </button>
 	<label class="mdl-textfield__label" translate>*[label]*</label>
 </div>