Handling Json response dynamically in angularjs

Json:

  {
"json": {
    "response": {
      "servicetype": "1",
      "functiontype": "10011",
      "statuscode": "0",
      "statusmessage": "Success",
      "data":{
            "roleid": 36,
            "rolename": "Product Managers",
            "divisionlabel": "Department ",
            "subdivisionlabel": "Category",
            "roleinformation": {
              "QA": [
                {
                  "White Box Testing": 0
                }
              ]
            }
          },

          {
            "roleid": 108,
            "rolename": "Teacher",
            "divisionlabel": "Class",
            "subdivisionlabel": "Div",
            "roleinformation": ""
          }
        ],
        "unassignedroles": [
          {
            "roleid": 36,
            "rolename": "Product Managers",
            "divisionlabel": "Department ",
            "subdivisionlabel": "Category",
            "roleinformation": {
              "QA": [
                {
                  "White Box Testing": 0
                }
              ]
            }
          },

          {
            "roleid": 108,
            "rolename": "Teacher",
            "divisionlabel": "Class",
            "subdivisionlabel": "Div",
            "roleinformation": ""
          }
        ]
      }
    }
  }
}

Above is my JSON Response. I did concationation for both unassignedroles[] and assignedroles[] to make single array.And then moved them into a dropdown. But when rolename is selected in dropdown , I need to populate roleinformation of that rolename in a table .If Product Managers is selected , the table should have Maximum values as 0 ( "White Box Testing": 0).I have done till drop down box but couldnt assign values to table dynamically.when role is changed.

JS:

 UserService.getAssignRoles(json).then(function(response) {
     if (response.json.response.statuscode == 0 && response.json.response.statusmessage == 'Success')
    {
        $scope.model.assignroles = [], assignrolesArray = [];

    var unasresdata = response.json.response.data.unassignedroles;
    var assresdata = response.json.response.data.assignedtoles;

    assignrolesArray = unasresdata.concat(assresdata);

    $scope.model.assignroles = assignrolesArray;


$scope.model.rolename = assignrolesArray[0].rolename;


    for (var i=0; i < assignrolesArray.length; i++){
        console.log($scope.model.rolename);
        console.log(assignrolesArray[i].rolename);
       if(assignrolesArray[i].rolename ===  $scope.model.rolename){
                console.log("success");
       }

   });

HTML:

<select class="form-control" ng-model="model.selectedValue" name="groupzname" ng-change="getselectval(model.selectedValue)" readonly disabled>
  <option ng-repeat="item in model.dropDownData track by $index" value="{{item}}">{{item}}</option>
                    </select>
           </div>
       <div class="form-group">
        <select class="form-control" name="role"
      ng-model="model.rolename"
      ng-change="getassignRole(model.rolename)">
<option selected>Select Roles</option>
<option ng-repeat="role in model.assignroles track by $index"
        value="{{role.rolename}}">{{role.rolename}}</option>

     <table  ng-repeat="role in model.assignroles track by $index" >
  <thead>
    <tr>
          <th >{{maxCount}}</th>
        </tr>
      </thead>
      <tbody>