Mark Mark - 5 months ago 17
AngularJS Question

Focus on input field

Template is 'tabs' with 2 tabs. On the first tab, I have an

input
field I want to put focus on. It is working when the app starts with the
input
field being focused, but when I switch to the second tab and then back to the first tab, the input loses focus.

I would like it be focused when I go from tab 2 to 1 too. When I click outside the element, it to loses focus as well. I actually want that
input
field to be ALWAYS focused.

I tried some already mentioned solutions:

.directive('focusMe', function($timeout) {
return {
scope: { trigger: '=focusMe' },
link: function(scope, element) {
scope.$watch('trigger', function(value) {
if(value === true) {
//console.log('trigger',value);
//$timeout(function() {
element[0].focus();
scope.trigger = true;
//});
}
});
}
};
});


<label class="item item-input" focus-me>
<input type="number" class="somett" ng-model="code" ng-model-options="{ debounce: 100 }" placeholder="Ready" ng-change="load(code) " focus-on="focusTextInput" autofocus>
</label>

Answer

You can use View LifeCycle and Events.

Add this to your controller.

$scope.$on('$ionicView.enter', function() {
  $scope.$broadcast("focusTextInput");
    //trigger input focus
});
Comments