用空值替换jsonp图像对象的占位符image

Substituting place holder image for jsonp image object with a value of null

本文关键字:占位符 image 对象 图像 空值 替换 jsonp      更新时间:2023-09-26

使用angular,我正在制作ajax jsonp请求从twitch检索通道。电视的api。一些渠道没有标志图像,所以我想把一个占位符图像与空标志对象的渠道。我创建了一个对象$scope。Imgs当前有两个属性:data。标志,这是标志图像从抽搐。tv api和replaceData,这是图像url到替换图像,我想用作为图像占位符。我创建了一个if语句来测试天气数据。徽标是空的,如果它是用替换图像字符串替换src属性字符串,但我使用ng-src,所以我想知道我如何能够针对ng-src,如果我采取正确的方法来替换一个空图像对象值的通道?

有更多的代码,但这是我有困难的部分…

$http.jsonp(url + streamers[i] + callback).success(function(data) {
                        $scope.imgs = {
                            current: data.logo,
                            replacement: "http://www.zwani.com/graphics/hello_funny/images/56467.jpg"
                        }
                        if (data.logo === null) {
                            $scope.imgs.current = $scope.imgs.replacement;
                            var replaceData = $scope.imgs.current;
                            console.log($scope.imgs.current);
                            document.getElementsByTagName('img').src = replaceData;
                        }
                        self.info.push(data);
                    }) 

你把它弄得太复杂了。你所需要做的就是用url字符串更新属性。

Angular会帮你显示它的

$http.jsonp(url + streamers[i] + callback).success(function(data) {
   var placeholder ="http://www.zwani.com/graphics/hello_funny/images/56467.jpg";
   if(!data.logo){
       data.logo = placeholder ;
   }
   self.info.push(data);    
});

您也可以让数据。将Logo设为null,然后在你的HTML中这样做…

<img ng-src="{{$scope.imgs.logo || 'http://www.zwani.com/graphics/hello_funny/images/56467.jpg'}}">