JSFiddle - React, Tailwind, and code Playground

by Khajan Singh

HTML

<div >
    <input type="search" id="search">
    <i class="icon-clear" focus-on-clear="search"></i>
</div>

JavaScript

angular.module('directivesModule', []);
angular.module('directivesModule').directive('focusOnClear', [
    '$timeout',
    function (timeout) {
    console.log(timeout);
        return {
            restrict: 'A',
            link: function (scope, element, attrs) {
                var id = attrs.focusOnClear;
                var $inputSearchElement = $(element).parent().find('#' + id);
                console.log($inputSearchElement, id);
                timeout(function () {
                  $inputSearchElement.focus();
                  console.log('focused');
                }, 10);
            }
        };
    }
]);