How can we concat angular js variable with ng-model

Question

<div class="row" data-ng-repeat="i in [1,2,3,4]">
            <div asterick class="form-group" ng-class="{'form-group has-success': !error['resource_type'] && (submitted), 'form-group has-error': (error['resource_type']) && (submitted)}"> 
                <label for="resourceType">Resource Type</label>
                 <select name="resourceType" id="resourceType" ng-model="data.resource_type+{{ i }}" ng-required="true"  >
                    <option ng-repeat="option in resourceTypeJson" value="{{option}}">{{option}}</option>
                </select>
           </div>
</div>

I am trying to access that i (loop variable) with ng-model. I need resource_type1, resource_type2 and so on. How can I do this please help.

Answer 1

Make resource type an array instead of separate properties.

{
    data: {
        resource_type1: 'data1',
        resource_type2: 'data2',
        resource_type3: 'data3'
    }
}

becomes

{
    data: {
        resource_type: ['data1', 'data2', 'data3']
    }
}

and then you can do that following in your ngModel:

ng-model="data.resource_type[i]"

What if you can't do the above?

You can try the following:

ng-model="data['resource_type' + i]"

Answer 2

change the ng model like htis

ng-model="data['resource_type' + i]"

This way ng model property name gonna change dynamically

Demo

angular.module("app",[])
.controller("ctrl",function($scope){
  $scope.data = {}

})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
 <div class="row" data-ng-repeat="i in [1,2,3,4]">
             
                 <select  name="resourceType" id="resourceType" ng-model="data['resource_type' + i]" ng-required="true"  >
                    <option ng-repeat="option in [1,2,3,4]" value="{{option}}">{{option}}</option>
                </select> 
</div>
{{data}}
</div>