JSFiddle - React, Tailwind, and code Playground

by Pankaj Parkar

HTML

<div ng-app="app">
    <div ng-controller="MainCtrl">
        <input type="text" class="form-control" data-ng-model="searchTest"></input> 
        <a class="adjst" ng-class="{'clear': searchTest.length == 0}" data-ng-click="clearSearch()">X</a>
    </div>
</div>

CSS

.clear {display:none;}
.adjst {float: left;margin-left: -15px;margin-top: 3px;}
input{float:left;}

JavaScript

var app = angular.module("app", []);

app.controller("MainCtrl", function ($scope) {
    $scope.searchTest = "";

    $scope.clearSearch = function () {
        $scope.searchTest = "";
    };
});