Извлечь URL-адрес изображения из значений объекта - угловой js

Question

Очень нуб здесь, чтобы Угловой JS.

Я работаю над проектом, и у меня есть решение этого вопроса, но мне было интересно, есть ли лучший подход , который будет немного более «угловым», если хотите.

По существу для каждого VideoID, он выполняет AJAX запрос, что местонахождение VideoID Имидж и места, в атрибуте SRC.

В чистом javascript это не проблема, и я выяснил одно решение, но оно отклоняется от углового подхода.

Мне было интересно, можно ли сделать что-то вроде того, что у меня есть. (Очевидно, что это не работает пока)

Markup

<ul class="storysContainer"> 
    <li video-on-click ng-repeat="video in videos" id="video{{$index}}" > 
      <img ng-src="{{getVideoThumb()}}"> 

    </li> 
    </ul> 

JS

$scope.videos = [ 
     { 
     'videoid': '1122345' 
     }, 
     { 
     'videoid': '1134567' 
     }, 
     { 
     'videoid': '2234456' 
     } 
    ]; 


    $scope.getVideoThumb = function() { 
    $.get("http://blahblah.com/id=" + url,function(data){ 
    var urlMain = data.channel.item["media-group"]["media-thumbnail"]["@attributes"].url; 
    array.push(urlMain); 
    }); 
    return array; 
    } 

Благодаря

редактировать:

Это решение, которое я придумал with..not конечно, если это обязательно лучшая оценка углового эска, но она работает.

angular.forEach($scope.videos, function(data) { 
    var dataid = "http://blablah.com?id=" + data.videoid; 
    console.log(dataid); 
    $.get(dataid, function(img){ 
    var urlMain = img.channel.item["media-group"]["media-thumbnail"]["@attributes"].url; 
    $('#thumb' + data.videoid).attr('src', urlMain); 
    //array.push(urlMain); 
    }); 
}); 

Answer 1

Я хотел бы объявить URL для каждого объекта в массиве videos объекта. Таким образом вы можете просто привязать значение в своем слое презентации.

Так что, может быть что-то вроде

$scope.videos = [ 
    { 
    'videoid': '1122345' 
    }, 
    { 
    'videoid': '1134567' 
    }, 
    { 
    'videoid': '2234456' 
    } 
]; 

//modified this a little. I take it this call accepts the videoID as a parameter 
//and returns the url for a single video? 
//I wasn't sure what the 'array' variable you were using was. 
//I am also using angular $http service to make this ajax call 

$scope.getVideoThumb = function(videoID) { 
    $http.get("http://blahblah.com/id=" + videoID).success(function(data){ 
    var urlMain = data.channel.item["media-group"]["media-thumbnail"]["@attributes"].url; 
    return urlMain; 
    }); 
    } 

//iterate through each object and assign it a 'URL' property to the result of 'getVideoThumb(videoID)' 
for(var i = 0; i < $scope.videos.length; i++){ 
    $scope.videos[i].URL = $scope.getVideoThumb($scope.videos[i].videoid); 
} 

и теперь в нашем презентационном уровне мы можем просто привязать значение URL в нг-Src

<li video-on-click ng-repeat="video in videos" id="video{{$index}}" > 
     <img ng-src="{{video.URL}}"> 

</li>