javascript – 用于拉动车辆图像的AngularJS和Edmunds Media API

发布时间:2020-08-01 发布网站:脚本之家
脚本之家收集整理的这篇文章主要介绍了javascript – 用于拉动车辆图像的AngularJS和Edmunds Media API脚本之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
情况:使用Rails应用程序和AngularJS中的$http.get从Edmunds.com MEDIA API中提取照片.

任务尝试完成:重复 – 通过车辆照片重复.

条件:我成功地获得了响应,并且能够加载一个图像,但是如何让它在照片阵列中重复并完成所有图像.

对于不清楚的解释道歉,以及任何帮助表示赞赏.

index.html的:

<h1> Wheel Tire Family </h1>
   <!--  CAR IMAGES  -->
   <div ng-init="carImages">

     <img src="https://media.ed.edmunds-media.com/{{carImages}}">

   </div>

catalog_controller.js:

$scope.photos = {};
$scope.carImages = {};

//GET the edmunds media api for the
//Make Model Year photos

$http.get("https://api.edmunds.com/api/media/v2/audi/a3/2015/photos?title=&category=exterior&provider=oem&width=1280&shottype=S&pagenum=1&pagesize=10&view=basic&api_key=api_key&fmt=json")
    .success(function (data) {
        var photos = data;
        console.log(photos);
        $scope.carImages = photos.photos[0].sources[0].link.href;
        console.log($scope.carImages);
        });

解决方法

也许是这样的?

.success(function (data) {
    $scope.carImages = data.photos;
});

HTML

<div ng-repeat="carImage in carImages">
    <img ng-src="https://media.ed.edmunds-media.com/{{carImage.sources[0].link.href}}">
</div>

这应该遍历图像并选择第一个“源”链接.还建议您使用ng-src而不是src.

总结

以上是脚本之家为你收集整理的javascript – 用于拉动车辆图像的AngularJS和Edmunds Media API全部内容,希望文章能够帮你解决javascript – 用于拉动车辆图像的AngularJS和Edmunds Media API所遇到的程序开发问题。

如果觉得脚本之家网站内容还不错,欢迎将脚本之家网站推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您喜欢交流学习经验,点击链接加入脚本之家官方QQ群:1065694478
脚本之家官方公众号

微信公众号搜索 “ 程序精选 ” ,选择关注!

微信公众号搜索 “ 程序精选 ”
精选程序员所需精品干货内容!