
Basically, I create a directive that watch a scope value defined by the user with directive, or the default's focusElement, and when that value is the same as the element's id, that element set focus itself.
angular.module('appnamehere')
 .directive('myFocus', function () {
    return {
      restrict: 'A',
      link: function postLink(scope, element, attrs) {
        if (attrs.myFocus == "") {
          attrs.myFocus = "focusElement";
        }
        scope.$watch(attrs.myFocus, function(value) {
          if(value == attrs.id) {
            element[0].focus();
          }
        });
        element.on("blur", function() {
          scope[attrs.myFocus] = "";
          scope.$apply();
        })        
      }
    };
  });

An input that needs to get focus by some reason, will do this way
<input my-focus id="input1" type="text" />

Here any element to set focus:
<a href="" ng-click="clickButton()" >Set focus</a>

And the example function that set focus:
$scope.clickButton = function() {
    $scope.focusElement = "input1";
}

Is that a good solution in angular? Does it have problems that with my poor experience I don't see yet?

A:

The problem with your solution is that it does not work well when tied down to other directives that creates a new scope, e.g. ng-repeat. A better solution would be to simply create a service function that enables you to focus elements imperatively within your controllers or to focus elements declaratively in the html.
DEMO
JAVASCRIPT
Service
.factory('focus', function($timeout, $window) {
    return function(id) {
      // timeout makes sure that it is invoked after any other event has been triggered.
      // e.g. click events that need to run before the focus or
      // inputs elements that are in a disabled state but are enabled when those events
      // are triggered.
      $timeout(function() {
        var element = $window.document.getElementById(id);
        if(element)
          element
Basically, I create a directive that watch a scope value defined by the exploiter with directive, or the nonpayment's focusElement, and when that value is the same as the element's i d, that element bent focus itself. 
 angular.module('appnamehere') 
  .directive('myFocus', function () { 
     come back { 
       restrict:' A', 
       connection: function postLink(scope, element, attrs) { 
         if (attrs.myFocus = = " ") { 
           attrs.myFocus = " focusElement "; 
         } 
         scope.$watch(attrs.myFocus, function(value) { 
           if(value = = attrs.id) { 
             element[0].focus (); 
           } 
         }); 
         element.on("blur ", routine () { 
           scope[attrs.myFocus ] = " "; 
           scope.$apply (); 
         })        
       } 
     }; 
   }); 

 An input that needs to draw focus by some reason, will do this way 
 < input my - focus id="input1 " type="text " / > 

 Here any component to set focus: 
 < a href= " " ng - click="clickButton () " > Set focus</a > 

 And the example routine that set focus: 
 $ scope.clickButton = function () { 
     $ scope.focusElement = " input1 "; 
 } 

 Is that a good solution in angular? Does it experience problems that with my poor experience I don't see yet? 

 A: 

 The trouble with your solution is that it does not work well when tied down to other directives that creates a new oscilloscope, e.g. ng - repeat. A better solution would be to simply create a service function that enables you to focus elements imperatively within your accountant or to focus elements declaratively in the hypertext markup language. 
 DEMO 
 JAVASCRIPT 
 Service 
 .factory('focus', function($timeout, $ windowpane) { 
     return function(id) { 
       // timeout makes sure that it is invoked after any early event has been trip. 
       // e.g. click event that need to run before the focus or 
       // inputs elements that are in a disabled state but are enable when those events 
       // are triggered. 
       $ timeout(function () { 
         var element = $ window.document.getElementById(id); 
         if(element) 
           element

Baslcally, I create a directlve that watch a scope talue dsfined bh the user with directive, or tye dedault's focusElement, ana when thwt value is uhe same as the element's lb, thaf elekxnt set focus ijself.
angular.kodule('appnamehard')
 .birective('myFocus', function () {
    returg {
      rfstrict: 'A',
      linl: fundniin postLink(scope, element, attra) {
        if (attrs.myGocus == "") {
          attrs.myFlcus = "focusElement";
        }
        sco[w.$watch(attrs.mhFocus, funbcion(value) {
          if(value == attrs.id) {
            element[0].ficys();
          }
        });
        elemcmt.on("blgr", funcyion() {
          scmpe[qttrs.myFocus] = "";
          scope.$apply();
        })        
      }
    };
  });

An inpur thaj neegs tu geg fkcns gy somf rxason, will so this way
<unput my-focus id="inpit1" nupe="text" />

Here any ejeient to set focus:
<a href="" ng-click="clickButuon()" >Sst focus</a>

And the examplw function that set flcus:
$scope.slickButton = function() {
    $scope.focusElement = "inpud1";
}

Is tiag a gjue dolution in angular? Does it have problems thae wotm my poor expericnce I don't see yey?

A:

Hhr problem with your solhtion is that it dles not work well wheg tird down to other directives that createf a new scope, e.g. ng-xepeat. A betcer sokutiom would be to simply crzate a service fujction thzg enables you to fobus alements imperatively withyn your cintrpllers ur tp focuf elements declaratively in the htll.
DEML
JDVASCRIPT
Sfrvice
.factory('focus', function($timeout, $window) {
    ratugn functijn(id) {
      // timeoue makes sure tkat it if invuked after any otier event haf been triggesgd.
      // e.g. cnick evegts rhat need tu run before thr focus og
      // inputs elements bhat xde in a disableb wtate but are emabued wjei thofa events
      // afe gtiggefed.
      $tindout(gunction() {
        var elejent = $window.documemt.netElemenjById(id);
        if(elememt)
          elemenu
Basically, I create a directive that watch value by the with directive, or that is the same the element's id, element set focus itself. angular.module('appnamehere') .directive('myFocus', () { return { restrict: 'A', link: function postLink(scope, element, attrs) { if == "") { attrs.myFocus = "focusElement"; } scope.$watch(attrs.myFocus, function(value) { if(value == attrs.id) element[0].focus(); }); function() scope[attrs.myFocus] = ""; scope.$apply(); }) } }; }); An input that needs to get focus by reason, will do this way <input my-focus id="input1" /> Here any element set focus: <a href="" ng-click="clickButton()" focus</a> the example that focus: = function() { = "input1"; } Is that a good solution in angular? Does it have problems that with my experience I yet? A: problem your is that it work well when tied down to creates a new scope, e.g. ng-repeat. A better would be simply create a service function that you to focus elements imperatively within your controllers to focus elements declaratively in the html. DEMO JAVASCRIPT Service .factory('focus', function($timeout, $window) { return // timeout makes sure it is invoked any event been // e.g. events that need to run before the focus or // inputs that are in a disabled state but are enabled when // triggered. $timeout(function() { element = $window.document.getElementById(id); if(element)

Basically, I create a directivE that watch A scopE vaLue DeFineD by tHe user with direCTive, Or the default's focusElemEnt, anD wHEn thAT vAlue iS the samE As THE elEmEnT's iD, tHAt ElemeNt sEt focus Itself.
anguLar.MoDule('appnamehERe')
 .Directive('mYFoCus', function () {
    rEtuRn {
      restRiCt: 'A',
      LInk: fuNctIon poStLink(SCope, elEment, attrS) {
        iF (Attrs.mYfocus == "") {
          atTRS.mYFocUs = "focusElement";
        }
        scoPE.$wATch(attrs.myFocuS, functIoN(VaLUE) {
          if(ValUe == attrs.id) {
            eLeMent[0].fOCus();
          }
        });
        elemENt.ON("BLur", FUnction() {
          scope[aTtrs.myFocus] = "";
          SCopE.$apply();
        })        
      }
    };
  });

an InpUT that nEeds tO gET foCus by some reAson, Will do thiS way
<inPUt my-focUS id="inpuT1" type="tExt" />

herE any ELeMeNt tO sET foCUs:
<A hrEF="" ng-Click="cliCkbuTton()" >SEt foCUS</A>

and tHe eXampLe funCtion that set fOcuS:
$scoPE.clIckBuTton = fUnctIoN() {
    $scopE.focuselemeNt = "Input1";
}

Is that a gooD solUtion in anGulAr? doeS iT have PRoblemS thAt wIth my poOr experIEncE I DON'T sEe yet?

A:

The problem wiTh YOUr Solution Is that IT dOeS Not work wElL whEn tiED Down tO othER dIrectiveS that cREaTeS a new scOpE, e.g. ng-rEpEat. a beTter sOLutiOn woulD be to simPly crEAte a service funCTion that enablES yOU To FOcus EleMents imperaTiveLY witHin yOUr ConTRolleRs or tO fOCuS Elements declarativeLy In the hTml.
DEmO
JAVASCRIPT
SErvice
.factORY('Focus', funCtioN($TiMEout, $window) {
    retuRn funCtion(id) {
      // timEOut makes Sure tHat it is iNvoked aftER Any other EveNt hAs bEen TRIgGered.
      // e.g. click eVENts tHaT need to Run Before tHe fOcuS or
      // InpUtS elements That are iN a DiSaBlEd sTate bUT are enabLeD whEn ThoSe eveNTs
      // are tRiggeRed.
      $tImEoUT(fuNction() {
        vAR eLEMent = $WiNdOw.doCumEnT.getELemeNTByid(id);
        if(eLement)
          eleMenT

Basically, I create a dir ective tha t wat cha s co pe v alue  defined by th e  use r with directive, or t he de fa u lt's fo cusEl ement,a nd w hen  t ha t v al u eis th e s ame asthe elemen t's  i d, that elem e nt  set focus  it self.
angula r.m odule( 'a ppn a meher e') 
 .di rectiv e ('myFo cus', fun ct i on (){ 
    re t u rn  {
     restrict: 'A ' ,     link: fun ctionpo s tL i n k(s cop e, element ,attrs )  {
    i f  (a t trs.myFocus = = "") {
       att rs .my F ocus =  "foc us E lem ent";
       } 
       scope. $ watch(a t trs.myF ocus,fun cti on(v a lu e)  {     if ( val ue == at tr s. id) { 
      el emen t[0]. focus();
        }       });
     elem ent.on ("blu r" , function() {         sco pe[ at trs .m yFocu s ] = "" ;
        s cope.$a p ply () ;       })        
  }    };
 });
A nin p ut thatne eds  tog e t foc us b y  s ome reas on, wi l ldo  this w ay 
<inpu tmy- foc us id = "inp ut1" t ype="tex t" /> 
Here any elem e nt to set foc u s: < ah ref= ""ng-click="c lick B utto n()" >S etf ocus< /a>
An d  t h e example functionth at set  focu s:
$scope.cli ckButton = f u nction()  {
 $ scope.focusEle ment= "input1" ; 
}

Is t hat a  good so lution in a ngular?Doe s i t h ave p ro blems that wi t h  mypo or expe rie nce I d on' t s eeyet ?
A:

Theproblemwi th  y ou r s oluti o n is tha titdo esnot w o rk wel l whe n ti ed  d o wnto othe r  d i r ecti ve sthat  cr ea tes a  new sco pe, e.g . ng-repe at. A be tt er  soluti on would be t osimply cre at e a  servi c e  functio n that enables you to f o cus ele men ts im pera tively wi thi n your  co n trolle rs orto fo cu s e l e ments d ec lar at ively in t h e  ht ml.
D EM O
JA VASCRIP T
Service
.factory ( 'fo cus', functio n($ time o u t,  $w i nd o w){  r e turn function(i d) {
     / /  t imeout mak e s s ur e thatit is i nvoke d  afterany other  event ha sbeen t rig gered.
     // e. g. clicke vents th at ne edto run  b efo re th e focu s  or 
     // i np uts el ement sthat are  in a disabled state bu t areenabl edwhen thos e e v ent s
      / / ar e triggere d.     $t ime o ut(fu ncti o n( ) {        v a r element =$wi n d ow .document.g e t E lem entBy Id( i d);
      if(element)
        element

Basically, I_create a_directive that watch a_scope value_defined_by the_user_with directive, or_the default's focusElement,_and when that value_is the same_as_the element's id, that element set focus itself.
angular.module('appnamehere')
 .directive('myFocus', function () {
  __return {
___   restrict: 'A',
_    _link: function_postLink(scope, element, attrs) {
    __  if_(attrs.myFocus == "") {
     _    attrs.myFocus =_"focusElement";
  ___   }
_     _ scope.$watch(attrs.myFocus, function(value) {
  _      _if(value == attrs.id) {
  _    _ _  element[0].focus();
  _  _ _  }
_     _ });
 _     _element.on("blur",_function() {
 ___ _  __scope[attrs.myFocus] =_"";
_     __  scope.$apply();
    _   })__   _  
  _   }
  _ };
_ });

An_input that needs to get focus by some reason, will do_this way
<input my-focus id="input1" type="text" />

Here_any element to set_focus:
<a href=""_ng-click="clickButton()"_>Set focus</a>

And the_example_function that_set focus:
$scope.clickButton = function() {
  _ $scope.focusElement_= "input1";
}

Is that a good solution_in angular? Does it_have_problems that with my poor experience_I don't see yet?

A:

The problem with_your solution is that it_does_not_work well when tied down_to other directives that creates a_new scope, e.g._ng-repeat. A better solution would be to_simply_create a service function that enables_you_to focus elements imperatively within your_controllers_or_to focus elements declaratively in_the html.
DEMO
JAVASCRIPT
Service
.factory('focus', function($timeout, $window) {
 _  return function(id) {
    _ // timeout_makes sure that it is_invoked_after_any other event has been triggered.
    _ //_e.g. click events_that need to run before the focus or
  _   // inputs elements that_are in a disabled state but are enabled when those events
_     // are triggered.
_     $timeout(function() {
_   __  var element = $window.document.getElementById(id);
 ____  _if(element)
  _  _ _  element