Home > Mobile >  How to get value of dynamically added input with ng-model that inside ng-repeat?
How to get value of dynamically added input with ng-model that inside ng-repeat?

Time:10-28

        <tbody>
                                <tr ng-repeat="eta in etaArray">
                                    <td ng-init="modelIndex =$index">{{$index 1}}</td>
                                    <td style="visibility: hidden">{{eta.BKE_ID}}</td>
                                    <td style="visibility: hidden">{{eta.BKE_POINT}}</td>
                                    <td>{{modelIndex}}</td>
                                    <td>{{eta.BKE_POINT_Text}}</td>
                                    <td>{{eta.BKE_DESC}}</td>
                                    <td>{{eta.BKE_DATE | date:'dd-MM-yyyy'}}</td>
                                    <td>
                                        <input  value="{{eta.BKE_FACTDATE|  date:'yyyy-MM-dd' }}" ng-keyup="trackTimeChanging($event,this,$index)" ng-model="factDate[$index]" style="width: 55%" type="date" id="inputFactDate" /></td>


                                </tr>
                            </tbody>

Hi, everyone i have problem that i can't value from ng-model . Is there any solution how to get value of ng-model that inside ng-repeat

CodePudding user response:

Not sure where you're having difficulty, but if you are truly using $index to track the array, you can reference it directly as shown. I would imagine that tying it to an eta.id or something might be more useful, but using $index works.

angular.module('selectExample', [])
  .controller('ExampleController', ['$scope', function($scope) {
    $scope.etaArray = [{},{},{},{},{},{},{},{}];
    $scope.factDate = []
  }]);
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.6.10/angular.min.js"></script>
<div ng-app="selectExample">
  <div ng-controller="ExampleController">
    <div ng-repeat="eta in etaArray">
      <input ng-model="factDate[$index]" />
    </div>
    <hr>
    <p> The 5th input value: {{factDate[4]}}</p>
    <p>factDate array: {{factDate}}</p>
  </div>
</div>

CodePudding user response:

I have found solution , but it is little bit different , I used html id attribute for initializing $index and on the js side i can easily get that value .

Code Example :

      <tr ng-repeat="eta in etaArray">
                                    <td>{{$index 1}}</td>
                                    <td style="visibility: hidden">{{eta.BKE_ID}}</td>
                                    <td style="visibility: hidden">{{eta.BKE_POINT}}</td>
                                    <td>{{eta.BKE_POINT_Text}}</td>
                                    <td>{{eta.BKE_DESC}}</td>
                                    <td>{{eta.BKE_DATE | date:'dd-MM-yyyy'}}</td>
                                    <td>
                                        <input  value="{{eta.BKE_FACTDATE|  date:'yyyy-MM-dd' }}" ng-model="factDate" style="width: 55%" ng-change="trackTimeChanging(eta,$index)" type="date" id="{{'factDate'  $index }}" /></td>
                                </tr>

For getting this value :

 $scope.etaArray[index].BKE_FACTDATE = new Date($("#factDate"   index).val());

You can test with this approach , Good Luck !

  • Related