Problem -
ng-model are not creating dynamically. My input boxes are creating dynamically and I am trying to create ng-model dynamic like test[1], test[2] etc but when I firebug the form I am getting only - test[shiftnumber] for all input elements.
HTML code -
<body ng-controller="myCtrl">
<select id="shiftnumbers"
ng-model="event.shiftnumber"
ng-change="addShiftNumber(event.shiftnumber)"
ng-options="timeslot.value as timeslot.name for timeslot in shiftnumbers"
ng-init="event.shiftnumber = shiftnumbers[0].value"
class="btn">
</select>
<div ng-repeat="shiftnumber in selectedShiftnumbers">
<input type="text" name="test{{shiftnumber}}" ng-model="test[shiftnumber]" /> {{shiftnumber + 1}}
</div>
</body>
SCRIPT Code -
var myApp = angular.module("myApp", []);
myApp.controller("myCtrl", function($scope){
$scope.shiftnumbers = [];
for(var i=0; i< 23; i++) {
$scope.shiftnumbers.push({name: i, value: i});
}
$scope.addShiftNumber = function(num){
$scope.selectedShiftnumbers = [];
for(var i=0; i< num; i++) {
$scope.selectedShiftnumbers.push(i);
}
}
});
Because you don't have defined $scope.test[0], $scope.test[1] (you're using ng-model="test[shiftnumber]", so there should be $scope.test[shiftnumber]).
Try
$scope.addShiftNumber = function(num){
$scope.test = [];
$scope.selectedShiftnumbers = [];
for(var i=0; i< num; i++) {
$scope.selectedShiftnumbers.push(i);
$scope.test.push('');
}
}