convert json string object to integer in ng-view

Issue

i am trying to convert json object to integer in ng-view:

json string:

$scope.json_arr = [{
                    'id': '1',
                    'name': 'abc'
                },
                {
                    'id': '2',
                    'name': 'xyz'
                }];

in view:

<ul ng-repeat="vals in json_arr">
    <li><input type="number" ng-model="vals.id" /></li>
    <li><input type="text" ng-model="vals.name" /></li>
</ul>

when i see the ouput, the number field is coming blank as the value of the id object is string.

How do i convert string 'id':'1' to integer??

Demo Plunker

Solution

Use ng-init, this will run whenever a new element in the array appears for ng-repeat, if you use it like this:

<ul ng-repeat="vals in json_arr" ng-init="parseId(vals)">
    <li><input type="number" ng-model="vals.id" /></li>
    <li><input type="text" ng-model="vals.name" /></li>
</ul>

Then all that's left is to write the parseId function referenced

  $scope.parseId = function(val){
    val.id = parseInt(val.id);
  }

Plunkr

Answered By - Philipp Gayret