How to show a default image in an array with Ionic - angularjs

Question

I am working on an Ionic project with the api from the Movie Database. I have this array in an ng-repeat that shows me some images (cast pictures). But not all the images in the array have an actual picture.
Now I am trying to show a default image when the api does not provide an image. My question is how to do this with ng-if i suppose. In my controller I created a scope as followed:
$scope.default_image = '../img/default_poster.png';
Part of my controller:
.controller('MovieDetailCtrl', function($scope, $stateParams, $ionicLoading, MovieService) {
$ionicLoading.show({template: 'Loading ...'});
$scope.init = function(){
MovieService.getCastCrewInfo($stateParams.id).then(function(data){
$scope.casts = MovieService.castMovie;
$scope.default_image = '../img/default_poster.png';
});
$ionicLoading.hide();
}
})
Part of my HTML code:
<div class="content-cast">
<!-- <h3>Cast</h3> -->
<br>
<hscroller>
<ion-scroll direction="x" scrollbar-x="false" >
<hcard ng-repeat="cast in casts" >
<img ng-src="http://image.tmdb.org/t/p/w154/{{cast.profile_path}} || default_image" >
<p class="cast-name">{{cast.name}}</p>
</hcard>
</ion-scroll>
</hscroller>
</div>

Answer 1

Either use a scope function or ng-if
$scope.getImage = function(item){
return item.profile_path ? 'http://image.tmdb.org/t/p/w154/' + item.profile_path : $scope.default_image;
});
View
<img ng-src="{{getImage(cast)}}" >
For ng-if
<img ng-if="cast.profile_path" ng-src="http://image.tmdb.org/t/p/w154/{{cast.profile_path}}">
<img ng-if="!cast.profile_path" ng-src="{{default_image}}">