json - Angular Unable to Display Image from OMDBAPI -
i learning angularjs. in application, want display movie posters http://www.omdbapi.com
.
html
<div ng-app="moviesbrowserapp"> <div ng-controller="moviesctrl"> <strong>{{movie.title}}</strong> <div><img alt="{{movie.title}}" ng-src="movie.poster" /></div> </div> </div>
javascript
var moviesapp = angular.module('moviesbrowserapp', []); moviesapp.controller('moviesctrl', function ($scope, $http) { $http.get('http://www.omdbapi.com/?i=tt0112462&plot=short&r=json').success(function (data) { $scope.movie = data; }); });
the problem image unable display using url json result. when inspect traffic see 403 status of each image if images directly viewed via browser, display after page reload. seems can retrieve images browser's cache. permission restriction omdbapi.com
or what? there way fix issue?
assuming movie.poster has valid image url on return - use ng-src:
<img alt="{{movie.title}}" ng-src="movie.poster" />
Comments
Post a Comment