Get/Set values of dynamical generated input fields using ng-repeat in Angular


I have an input field which once filled with a number populates that count of additional input fields. I can’t figure out how to get the values inserted in those generated input fields. Any help is appreciated, and oh, I did try various things and even with angular.element, or solely with jquery, but failed, so any explanation on how to do this is welcome.

Here is my jsfiddle, and the code c/p-ed here:

<div ng-controller="MyCtrl">
<input type="text" ng-model="cntInputs" placeholder="#Inputs"><br/>

<input ng-repeat="i in getTimes()" type="text" placeholder="{{i}}" id="input_{{i}}">

<li ng-repeat="j in getTimes()">
Inputed value is: {{getValue(j)}}


var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
$scope.cntInputs = 0;

var a = new Array();

for(var i=1; i <= $scope.cntInputs; i++)

return a;

$scope.getValue = function(id){
//here get the value of that inserted in the element with the id of "input_" + id
return angular.element("input_" + id);

Problem courtesy of: Nikola


So add ng-model="inputs[i-1]" to your text field

Then in your controller add $scope.inputs= [];

Then in your getValue function: return $scope.inputs[id-1];

If you make your getTimes function 0 based you wouldn’t need the -1s

Updated your fiddle:

Solution courtesy of: James Kleeh

View additional discussion.