How to get the focus of input in angularJs (custom instruction)

The code can be run directly:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body>

    <div ng-app="myApp" ng-controller="control">
        <input type="text" set-Focus ng-blur="setBlur()">
        <button ng-click="getFocus()">Click to get focus</button>
    </div>  

<script type="text/javascript">     
    //Model
    var app = angular.module ('myApp', []);

    //controller
    app.controller("control",function($scope){
        $scope.isCome = false;     
        $scope.isFocus = false;      

        $scope.getFocus = function(){
            $scope.isFocus = true;
            $scope.isCome = true;
        };

        $scope.setBlur = function(){
            $scope.isFocus = false;
alert('lost focus')
        }
    });

    //custom command
     app.directive('setFocus',[ function(){
         return {
             scope:false,
             link:function(scope, element){                     
                 scope.$watch("isFocus",function(newValue,oldValue, scope) {
                    
                     if(newValue && scope.isCome){
                         element[0].focus(); //Get the focus
                         alert("Get the focus")
                     }
                }, true);;
             }
         };
    }]);

</script>
</body>
</html>

 

Guess you like

Origin http://10.200.1.11:23101/article/api/json?id=327055723&siteId=291194637