In angular version 1 i use ng-src to load an url. In angular 2 Js for Dart i can't find a similar method to load resources. For example in Angular 1 js:

 <img class="cover" src="images/cover_placeholder.png" data-ng-src="{{coverUrl}}"

in Angular 2 js i have already tried:

 <img class="cover" src="{{coverUrl}}">

How i can load a placeholder in case of image is not available? There areothers smart ways to do that?

EDIT Solved in this way:

   <img class="class-image" onError="this.src='./images/cover_placeholder.png';" src="{{coverUrl}}" >

If image is not avaible place the Placeholder image.

In angular version 1 i use ng-src to load an url. In angular 2 Js for Dart i can't find a similar method to load resources. For example in Angular 1 js:

 <img class="cover" src="images/cover_placeholder.png" data-ng-src="{{coverUrl}}"

in Angular 2 js i have already tried:

 <img class="cover" src="{{coverUrl}}">

How i can load a placeholder in case of image is not available? There areothers smart ways to do that?

EDIT Solved in this way:

   <img class="class-image" onError="this.src='./images/cover_placeholder.png';" src="{{coverUrl}}" >

If image is not avaible place the Placeholder image.

• javascript
• angularjs
• dart
• angular

• what do you mean with image not available? is the variable undefined or the image returns a 404 – juvian Commented Mar 16, 2016 at 16:21
• get to the image url returns a 404 – Andrea Bozza Commented Mar 16, 2016 at 16:22
• Are you using a directive? Don´t see how that case would be resolved with angular 1 – juvian Commented Mar 16, 2016 at 16:28
• i use dart with angular2 Javascript – Andrea Bozza Commented Mar 16, 2016 at 16:42
• You would probably need to do something like this but with angular2: stackoverflow./questions/16349578/… – juvian Commented Mar 16, 2016 at 16:45

1 Answer 1

It will depend on when you are getting the error. If it is erroring on load, it is because Angular hasn't kicked off by the time the html is loaded and so the url cannot be interpreted.

In AngularJS, this was circumvented by using ng-src

The Angular two equivalent is to use [src]=""

<img class="cover" [src]="coverUrl">