Angularjs input field focus event?

Question

i use angularjs and i have created a normal input field like this:

i

Answer 1

If you are using functionality that you may wish to apply to fields throughout your application, you could put the it into a directive. Here is an example that adds and removes a css class based on the focus or blur of a field:

angular.module('myApp').directive('inputFocus', function () {

var FOCUS_CLASS = 'input-focused';
return {
  restrict: 'A',
  priority: 1,
  require: 'ngModel',
  link: function (scope, element, attrs, ctrl) {
    element.bind('focus',function () {
      element.parent().addClass(FOCUS_CLASS);    
    }).bind('blur', function () {
      element.parent().removeClass(FOCUS_CLASS);
    });
  }
};
});

Answer 2

You can bind method B to angular's ng-blur directive to detect when an input loses focus

<input type='text' ng-focus='methodA()' ng-blur='methodB()' ng-model='model'>

Answer 3

You are looking at ng-focus and ng-blur.

<input type="text" style="border: none" ng-model="model" ng-focus="A()" ng-blur="B()">

On a side note, use css classes instead of inline styles.. :)

Or just call the same method with argument and set the value acc:-

 <input type="text" style="border: none" ng-model="model" ng-focus="A(true)" ng-blur="A(false)">