ионного изображения косяк груз из запроса HTTP

Question

Я пытаюсь получить изображение из Google Map Street View API, вот моя служба:

.factory('WeatherService', function($http) { 
    var GOOGLEMAP_KEY ="AIzaSyBZRxxrYsNGfIfUbGRCT1k948wAV-rwLGY"; 

    var urlGoogleStreetView = 'https://maps.googleapis.com/maps/api/streetview?key=' + GOOGLEMAP_KEY + '&size=480x320'; 

    return { 
    pictureLocation: function (lat,lng,h,p){ 
     return $http.get(urlGoogleStreetView + '&location=' + lat + ',' + lng + '&heading=' + h + '&pitch=' + p); 
    } 
    }; 
}); 

и это, как я это называю в контроллере:

$scope.imageSource=WeatherService.pictureLocation(46.414382,10.013988,151.78,-0.76); 

в представлении его показать сломанный изображение и дайте мне "GET http://localhost:8100/%7B%7D 404 (Not Found)" ошибка, но когда я называю это вручную

$scope.imageSource="https://maps.googleapis.com/maps/api/streetview?key=AIzaSyBZRxxrYsNGfIfUbGRCT1k948wAV-rwLGY&size=480x320&location=46.414382,10.013988&heading=151.78&pitch=-0.76"; 

изображение загружено отлично. Может кто-нибудь мне помочь?

Вот мой HTML

<ion-content scroll="true" ng-controller="HomeCtrl"> 

    <h3>{{city}}</h3> 
    <h5><weather-icon icon="current.currently.icon" id="current-icon"></weather-icon> {{current.currently.summary}}</h5> 
    <span class="large">{{current.currently.temperature}} &deg; </span><br> 
    <img ng-src="{{imageSource}}"> 

</ion-content> 

Answer 1

Мой английский плохой, но я постараюсь изо всех сил объяснить это.

ng-src должен равняться строке url. в $scope.imageSource=WeatherService.pictureLocation(46.414382,10.013988,151.78,-0.76);, $scope.imageSource - это данные изображения, а не строка url.

в $scope.imageSource="https://maps.googleapis.com/maps/api/streetview?key=AIzaSyBZRxxrYsNGfIfUbGRCT1k948wAV-rwLGY&size=480x320&location=46.414382,10.013988&heading=151.78&pitch=-0.76";, $scope.imageSource - это строка URL.

так, используя ваш сервис проверит ошибку.

так что вы можете изменить свой код, как этот

.factory('WeatherService', function() { 
var GOOGLEMAP_KEY ="AIzaSyBZRxxrYsNGfIfUbGRCT1k948wAV-rwLGY"; 

var urlGoogleStreetView = 'https://maps.googleapis.com/maps/api/streetview?key=' + GOOGLEMAP_KEY + '&size=480x320'; 

return { 
pictureLocation: function (lat,lng,h,p){ 
    return urlGoogleStreetView + '&location=' + lat + ',' + lng + '&heading=' + h + '&pitch=' + p; 
    } 
}; 
}); 

Answer 2

Если URL-декодированием% 7B% 7D дает вам {}, что означает, что $ scope.imageSource возвращается пустой объект. Вам необходимо проверить, что WeatherService.pictureLocation(46.414382,10.013988,151.78,-0.76);

возвращает путь к изображению, а не пустой объект.