Error: unsafe value used in a resource URL context (see

  angular, angular-cli

I am working with angular cli, I have a rest api made with yii2, my problem is the following:

I have a component, which consists of a video gallery, which are youtube links ( In the api I have all the urls for the component, so it looks like this:


<div *ngFor="let video of videos" class="col-lg-4 col-sm-6">
    <div class="embed-responsive-item video-noticia">
        <div class="video-responsive">


export class VideosComponent implements OnInit {

    videos: Video[] = [];

    constructor(private data: DataService) { }

    ngOnInit(): void {
    // => console.log(data)); => this.videos = data);        


in the folder of the component (videos), i have the service to call api:


    providedIn: 'root'
export class DataService {

    private urlApi = 'http://localhost/web/api/web/video';

    constructor(private http: HttpClient) { }

    getAllVideos(): Observable<Video[]> {
        return this.http.get<Video[]>(this.urlApi);

And the following error is:
enter image description here

I read in other queestions about to create a pipe with DomSanitizer, I tried but didn’t work for me.
I hope someone can help me. Thanks.

Source: Angular Questions

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.