我需要根据需要加载angularjs中的数组中的图像,这意味着我希望图像仅在滚动到此图像时加载。图片的来源是base64。我可以加载图像,但我不知道如何做懒惰加载。我的html:
<table ng-if="This_Page.Images_Src" class="table">
<tr >
<td ng-repeat="One_Entry in This_Page.Images_Src track by $index" ng-init="index = $index">
<img data-ng-src="{{One_Entry}}" width="240" height="152">
</td>
</tr>
</table> 我的js:
$scope.Handle_Doc_Images_Arrival = function(data){
if ((typeof data != "undefined") &&
( data != "" ) &&
(typeof data.Server_Status != "" ) &&
( data.Server_Status == 200 ) ) {
var l_Result = JSON.parse(JSON.stringify(data)) ;
if(typeof l_Result.Server_Response.Result_Code !== "undefined" &&
l_Result.Server_Response.Result_Code == "0" ) {
$scope.This_Page.Doc_Images = [] ;
$scope.This_Page.Images_Src = [] ;
$scope.This_Page.Doc_Images = l_Result.Server_Response.Result_Data.Doc_Images ;
for(var i = 0 ; i < $scope.This_Page.Doc_Images.length ; i++){
$scope.This_Page.Images_Src.push($scope.This_Page.Doc_Images[i].Image) ;
}
}
else {
$rootScope.Show_Error_Message('Attempt to get Doc Images failed : ' + l_Result.Server_Response.Result_Message) ;
return ;
}
}
}发布于 2019-01-13 18:04:50
您可以尝试使用plunker
<img style="width: auto;" my-lazy-src="https://www.w3schools.com/images/picture.jpg">这段代码取自this article
https://stackoverflow.com/questions/54167110
复制相似问题