kalmas kalmas - 1 year ago 1045
Javascript Question

Correct way Provide DomSanitizer to Component with Angular 2 RC6

I'm attempting to use DomSanitizer to sanitize a dynamic URL within a Component using I can't seem to figure out what the correct way to specify a Provider for this service is.

I'm using Angular 2.0.0-rc.6

Here's my current component:

templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ],
providers: [ DomSanitizer ],
export class AppComponent implements OnInit
public url: SafeResourceUrl;

constructor(private sanitizer: DomSanitizer) {}

ngOnInit() {
let id = 'an-id-goes-here';
let url = `https://www.youtube.com/embed/${id}`;

this.videoUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);

ngOnDestroy() {}

This results in the error
this.sanitizer.bypassSecurityTrustResourceUrl is not a function
at runtime.

Could someone show me an example of how to properly provide a Provider for DomSanitizer? Thanks!

Answer Source

You don't need provider at all. Just need to import DomSanitizer as shown below,

import { DomSanitizer, SafeResourceUrl, SafeUrl} from '@angular/platform-browser';