javascript - ng-repeat 显示空白值

Question

已更新问题并提供解决方案。我从 https://filters.rocks/embed/466.json 获取 json feed .

json 正在我的范围内通过，但我可以在我的 pre 标记中查看它，但无论出于何种原因，它都没有填充我的 ng-repeat。

app.controller('InstagramCtrl', ['$scope', '$http',
function($scope, $http) {
    $scope.items = [];
    $http.get('https://filters.rocks/embed/466.json').then(function(response) {
            $scope.items = response;
            instagramSuccess($scope, $scope.items);

    });

    var instagramSuccess = function(scope, response) {
        if (response.data.length <= 0) {
            $scope.error = response.meta.error_type + ' | ' + response.meta.error_message;
            return;
        }
        if (response.data.length > 0) {
            $scope.items = response.data;

        } else {
            $scope.error = "This hashtag has returned no results";
        }
    };

}
]);

HTML

    <div class="container" ng-controller="InstagramCtrl">

    <div class="row">
        <div class="col-md-12">
            <div class="panel panel-default">
                <div class="panel-heading">

                </div>
                <div class="panel-body">
                    <ul class="instagram-list" ng-repeat="item in items">    
                        <li>
                            <small>{{item.data.feed.id}}</small>
                            <img ng-src="{{item.data.feed.approved_images.medium}}" width="250">
                        </li>

                    </ul>                       
                </div>
                <pre> filter.rocks {{ items | json }} </pre>
            </div>
        </div>           
    </div>

更新我从每个人那里收集了一些零碎的东西，最后得到了这个； Controller

$scope.items = [];

      $http.get('https://filters.rocks/embed/466.json').then(function(response) {

            instagramSuccess(response);

    });

    var instagramSuccess = function(response) {
        if (!response.data) {
            $scope.error = response.meta.error_type + ' | ' + response.meta.error_message;
            return;
        }
        // check if data is defined if so, check objects are defined, then if array is defined. 
        if (response.data && response.data.feed && response.data.feed.approved_images && response.data.feed.approved_images.length ) {
            //if all good $scope.items becomes array
            $scope.items = response.data.feed.approved_images;

        } else {
            $scope.error = "This hashtag has returned no results";
        }
    };

HTML

                 <ul class="instagram-list" ng-repeat="item in items">    
                        <li class="instagram-item">
                            <small style="color:blue;">{{item.id}}</small>
                            <div bg-img="{{item.medium}}" width="250"></div>
                        </li>
                    </ul>

Answer 1

正如 madhairsilence 所指出的，您将项目视为数组，但实际上它不是数组。您可能希望重复批准的图像，如下所示:

<ul class="instagram-list" ng-repeat="item in items.feed.approved_images">    
    <li>
        <small>{{item.id}}</small>
        <img ng-src="{{item.medium}}" width="250">
    </li>
</ul>