Изображение не отображается, пока мы не обновим страницу

В моем приложении, когда мы вошли в систему, я передаю Http запрос на получение изображения. Изображение загружается успешно, но не отображается, пока я не обновлю страницу.

Я хочу, чтобы он отображался при входе в систему с помощью angular в моем приложении.

<img ng-src="{{ProfileImage}}" />

Это HTTP-вызов:

  $http.get('URLpath')
    .then(function(response){
$scope.ProfileImage=response.data;
}

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

Отображается после обновления страницы.

Источник

3 ответа

Решение

Спасибо за ответ ребята. Эта проблема устранена путем сохранения изображения в локальном хранилище окна и последующего доступа к нему с помощью angular {{ProfileImage}}.

Источник

Вы должны либо обернуть ваше изображение в ng-if поэтому он должен появиться после загрузки данных или назначить некоторые действительные данные $scope.ProfileImage до ответа В противном случае ваш ng-src пренебрегают.

Источник 
var app = angular.module('myApp', []);
app.controller('DemoCtrl', function($scope, $http) {

    $scope.myObj = { 
        "image":"https://www.w3schools.com/css/trolltunga.jpg", 
    };

});

<!DOCTYPE html>
<html>

<body>

<div ng-app="myApp" ng-controller="DemoCtrl"> 
<img src="{{myObj.image}}"  width="100" height="100">

</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

</body>
</html>
Источник
Другие вопросы по тегам