AngularJS Scope.Feed Looping

Question

How do i Loop this data using AngularJS?

In Laravel, I can do a var_dump in HTML but i'm not familiar with Angular. Any advice on degbugging and how do i Loop this?

$scope.feed = result.data;

.controller('FeedEntriesCtrl', function($scope, $stateParams, $http, FeedList, $q, $ionicLoading, BookMarkService) {
        $scope.feed = [];

        $scope.doRefresh = function() {
            $http.get("http://www.com/api/admin/v1/getListing?token=www")
                .then(function (result) {
                    $scope.feed = result;
                    console.log(result);
                    $ionicLoading.hide();
                    $scope.$broadcast('scroll.refreshComplete');
                }, function (reason) {
                    $ionicLoading.hide();
                    $scope.$broadcast('scroll.refreshComplete');
                });
        };

        $scope.doRefresh();

        $scope.bookmarkPost = function(post){
            $ionicLoading.show({ template: 'Post Saved!', noBackdrop: true, duration: 1000 });
            BookMarkService.bookmarkFeedPost(post);
        };
    })

Answer 1

In controller there are two get request for getting list.

 $http.get('http://www.com/api/admin/v1/getListing?token=www')

and

FeedList.get('http://www.com/api/admin/v1/getListing?token=wwww')

Here second request send on success respones of first request. It is not require. Remove one request from code.

Other thing is:

$scope.feed = result;

Here result is assigningto $scope.feed variable so you can access only feed object in DOM not data variable. You are trying to access data object in ng-repeat

data is object of feed so you can access is using .(dot) property.

feed.data

From image it is not visible about id but if id is available object from array then rest of code will work fine. You have to just change data to feed.data in ng-repeat

 <div class="list category-feeds">
      <a ng-repeat="source in feed.data" class="item item-icon-right" ui-sref="app.feed-entries({categoryId: source.id, sourceId: (source.id | slugify)})">
        <div class="thumbnail-outer">
          <pre-img ratio="_1_1" helper-class="">
            <img class="thumbnail" ng-src="{{source.id}}" spinner-on-load>
          </pre-img>
        </div>
        <div>
          <span class="title">{{source.id}}</span>
          <p class="description">{{source.id}}</p>
        </div>
      </a>
    </div