ng-model accesses nested objects


I have a grid on my page, by click on row in this grid, User can see the form for editing values of this row. The problem is that I'm using ng-repeat that to show data and nested values displayed as [Object object]. How to get an access to this values? I've tried something like rowData[k].name but it returns only second part of form, the first part is empty. Where is my mistake? Plunker


$scope.load = function(){

       method: "GET",
       url: 'test.json'
       .then(function success(response) {
              $scope.rowData =;
       }, function error(response) {
                 console.log("It has happend error in response")
      $ = $;
           $scope.rowKeys = Object.keys($scope.rowData);


<form style="padding: 15px" ng-submit="submitForm()" >
         <div class="form-group row">
          <div ng-repeat="k in rowKeys | filter: '!0' | filter: '!$$'" ng-model="rowVal" >
            <div ng-if="(k === 'id' || k.toLowerCase().endsWith('id') === false) ? true : false">
             <label for="rowValue" class="col-sm-2">
                {{k | hide:'.name' | makeUppercase }}:
         <div class=" col-sm-2" >
              <input class="form-control rowValue" id="rowValue"
<button type="submit" class="btn btn-default" ng-if="rowData">Save</button>
<button type="button" class="btn btn-default" ng-if="rowData" ng-click="cancelForm()">Cancel</button>

Considering your plunker/example, you are showing three types: object, string and number. You can use the angular.isObject(value) method to check if a value is object or not. If it's an object, you can use the dot notation. Otherwise just show the value.

<input ng-if="!isObject(rowData[k])" class="form-control rowValue" id="rowValue"

<input ng-if="isObject(rowData[k])" class="form-control rowValue" id="rowValue"

$scope.isObject = function(value) {
    if(angular.isObject(value)) {
      return true;
    } else {
      return false;

See this Plunker.