Come aggiungerei lo stato attivo al campo appena creato? Vedi l'esempio finora: http://jsfiddle.net/aERwc/165/Angolare: concentra l'attenzione su un campo di input creato dinamicamente
$scope.addField = function() {console.log('hi');
$scope.fields[$scope.keyToAdd] = $scope.valueToAdd;
$scope.setFieldKeys();
$scope.keyToAdd = '';
$scope.valueToAdd = '';
}
è possibile utilizzare questo approccio tuttavia sarà necessario aggiungere l'animazione al vostro ng-repeat. vedi ng-repeat animation complete callback
sostanzialmente in callback chiamata element.focus()
.animation('.repeat-animate', function() {
return {
enter: function (element, done) {
element.hide().show(100, function(){
var scope = element.scope();
scope.$evalAsync(function(){
element.find(':last')[0].focus();
});
});
}
};
});
AGGIORNATO CODEPEN: http://codepen.io/ev-tt/pen/BNXBmd?editors=101
Per me, questo sembra il modo più semplice per farlo:
HTML
<html ng-app='app'>
<body ng-controller='MainController as vm'>
<input ng-repeat='thing in vm.things'>
<hr />
<button ng-click='vm.addThing()'>Add Thing</button>
</body>
</html>
JS
angular
.module('app', [])
.controller('MainController', MainController)
;
function MainController($timeout) {
var vm = this;
vm.things = [{}];
vm.addThing = function() {
vm.things.push({});
$timeout(function() {
// have to do this in a $timemout because
// we want it to happen after the view is updated
// with the newly added input
angular
.element(document.querySelectorAll('input'))
.eq(-1)[0]
.focus()
;
}, 0);
};
}
Personalmente, mi sarebbe effettivamente utilizzare jQuery e rendere il codice ancora più semplice:
$('input:last').focus();
Invece di:
angular
.element(document.querySelectorAll('input'))
.eq(-1)[0]
.focus()
;