title: <img>: Unsafe value used in a resource URL context
body: <p>Since upgrading to the latest Angular 2 release candidate, my <code>img</code> tags:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;img class='photo-img' [hidden]="!showPhoto1" src='{{theMediaItem.photoURL1}}'&gt;
  </code></pre>
  
  <p>are throwing a browser error:</p>
  
  <blockquote>
    <p>ORIGINAL EXCEPTION: Error: unsafe value used in a resource URL context</p>
  </blockquote>
  
  <p>The value of the url is:</p>
  
  <pre><code>http://veeu-images.s3.amazonaws.com/media/userphotos/116_1464645173408_cdv_photo_007.jpg
  </code></pre>
  
  <p><strong>EDIT:</strong></p>
  
  <p>I have tried the suggestion made in the other solution that this question is supposed to be a duplicate of but I am getting the same error.</p>
  
  <p>I have added the following code to the controller:</p>
  
  <pre class="lang-js prettyprint-override"><code>import {DomSanitizationService} from '@angular/platform-browser';
  
  @Component({
    templateUrl: 'build/pages/veeu/veeu.html'
  })
  export class VeeUPage {
    static get parameters() {
      return [[NavController], [App], [MenuController], [DomSanitizationService]];
    }
  
    constructor(nav, app, menu, sanitizer) {
  
      this.app = app;
      this.nav = nav;
      this.menu = menu;
      this.sanitizer = sanitizer;
  
      this.theMediaItem.photoURL1 = this.sanitizer.bypassSecurityTrustUrl(this.mediaItems[1].url);
    }
  </code></pre>
  
  <p>I am still getting the same error message.</p>
  
  <p><strong>EDIT2:</strong></p>
  
  <p>I have also changed the html to:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;img class='photo-img' [hidden]="!showPhoto1" [src]='theMediaItem.photoURL1'&gt;
  </code></pre>
  
  <p>I still get the same error message</p>