如何使用 ng-repeat 迭代存储在对象中的数组

Question

我调用了一个返回单个对象的 API 端点。我想遍历存储在对象中的名为video 的数组，并将存储在数组中的所有链接返回到视图。

从 API 返回的 JSON 对象

html代码

<div class="myVideo" ng-repeat="v in courses.video">
     <iframe width="560" height="315" ng-src="{{'v.video'}}" 
      frameborder="10" allowfullscreen></iframe>
</div>

用于 API 调用的控制器中的功能

$scope.getCourse = function(id){
        coursesFac.getCourseById(id)
            .then(function (response) {
                $scope.courses = response.data;
                var items =response.data;
                console.log(items);
                //console.log($scope.courses.video);
            }, function (error) {
                $scope.status = 'Unable to load course data: ' + error.message;
                console.log($scope.status);
            });
    };

此错误出现在应显示视频的视图中

Answer 1

courses.video 是一个字符串 - 不是一个数组。你需要解析json

$scope.getCourse = function(id) {
    coursesFac.getCourseById(id)
        .then(function(response) {
            response.data.video = JSON.parse(response.data.video); //HERE
            $scope.courses = response.data;
            var items = response.data;
            console.log(items);
            //console.log($scope.courses.video);
        }, function(error) {
            $scope.status = 'Unable to load course data: ' + error.message;
            console.log($scope.status);
        });
};