Question: I'm trying to loop through "tabs" in the Json object using AngularJS? How can I do it?

```
var model = {
    "$id": "1",
    "tabs": [{
        "$id": "2",
        "id": 2,
        "name": "Output",
        "layoutId": 1,
        "order": 1,
        "dashboardId": 1
    }, {
        "$id": "15",
        "id": 3,
        "name": "Yield",
        "layoutId": 1,
        "order": 2,
        "dashboardId": 1
    }, {
        "$id": "24",
        "id": 4,
        "name": "Trend",
        "layoutId": 1,
        "order": 3,
        "dashboardId": 1
    }],
    "id": 1,
    "name": "Test",
    "title": "Test",
    "description": "Test Dashboard",
    "createDate": "2015-06-08T00:00:00+01:00",
    "ownerId": 1,
    "enabled": true
};

```

When I try this, I get "undefined" in the console.

```
angular.forEach(model.tabs, function (tab) {
    console.log(tab.name);
});

```

not sure what I'm doing wrong?

EDIT: 
The data is coming from ASP.Net controller:

```
$http.get("/Dashboards/GetDashboardData").success(function (data) {
            model = data;
            angular.forEach(model.tabs, function (tab) {
                console.log(tab.name);
            });
        }).error(function (data) {
            console.log("error");
        });

```

Answer: 
I expect that the model is not ready at the time you loop though it. Run the following code with your inspector open - the code you have is correct, but in your case fails because `model` isn't ready when you run the loop. 

If you're loading data asyncronously you'll want to wait until the data is returned, either using a promise or a callback, and the loop through it.

```js
var model = {
    "tabs": [{
        "name": "Output",
    }, {
        "name": "Yield",
    }, {
        "name": "Trend",
    }],
};

angular.forEach(model.tabs, function (tab) {
    console.log(tab.name);
});
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
```
Ok I found the answer. It looks like my controller returns Json object as a string, so I have to switch it to object before I can use it as an object. 

I have add this line before using model in the loop:

```
model = JSON.parse(data);

```

The whole solution with promise (not sure if I need it now):

```
DataService.getDashboardData().then(function (data) {
        model = JSON.parse(data);
        angular.forEach(model.tabs, function (tab) {
            console.log(tab);
        });
    });

 app.service("DataService", ["$http", "$q", function ($http, $q) {
    return {
            getDashboardData: function () {
            var dfd = $q.defer();
                     $http.get('/Dashboards/GetDashboardData').success(function (result) {
                        dfd.resolve(result);
                });
            return dfd.promise;
        }
    };
}]);   

```