2013-08-30 3 views
5

Einfachen Fokus nicht funktioniert funktioniert nicht in WinkelFokusfunktion ist in Winkel

<div class="search pull-right tab-{{ showDetails2 }}" data-ng-click="showDetails2 = !showDetails2; showDetails = false; showDetails1 = false;searchFocus();"> 

html

<input type="text" data-ng-model="model.fedSearchTerm" 
        placeholder="New Search" required class="span12 fedsearch-box" /> 

MY Funktion

$scope.searchFocus = function() { 
      $('.fedsearch-box').focus(); 
     }; 
+0

http://stackoverflow.com/questions/14833326/how-to-set-focus-in-angularjs siehe Mark Antwort hier. –

Antwort

9

Hier ist eine robustere Implementierung, die sehr gut funktioniert:

myApp.directive('focusMe', function() { 
    return { 
     link: function(scope, element, attrs) { 
      scope.$watch(attrs.focusMe, function(value) { 
       if(value === true) { 
        element[0].focus(); 
        element[0].select(); 
       } 
      }); 
     } 
    }; 
}); 


<input type="text" ng-model="stuff.name" focus-me="true" /> 
+1

Das funktioniert sehr gut. Können Sie erklären, warum die $ watch benötigt wird, um den Fokus zu umbrechen und auszuwählen? Ich habe versucht, $ watch zu entfernen und natürlich funktioniert es ohne es nicht. –

1

Sie könnten eine Richtlinie zu diesem Zweck schreiben wie ;

myApp.directive('focus', function() { 
    return function (scope, element, attrs) { 
      element.focus(); 
    } 
}); 

Und in Ihrem HTML;

<input type="text" data-ng-model="model.fedSearchTerm" 
        placeholder="New Search" required focus /> 
9

ich das gleiche Problem aufgetreten. Habe es gelöst, indem ich den Fokusbefehl innerhalb von $ timeout eingefügt habe. Stellen Sie sicher, dass Sie den $ timeout-Parameter in der .controller-Funktion übergeben.

$timeout(function() { $('.fedsearch-box').focus(); }); 
+0

funktioniert gut für mich, und das Problem zu lösen .. – Habeeb

+0

schön, funktioniert auch für mich –