title: Refused to display 'https://www.youtube.com/watch?v=oKZRsBjQJOs' in a frame because it set 'X-Frame-Options' to 'sameorigin'
body: <p>I need to place a video from youtube in my website but the URL is a variable, I created a pipe to can put, but don't work.  </p>
  
  <p>This is my code in HTML file</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;iframe width="670" height="348" [src]=" video | video" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen&gt;&lt;/iframe&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>the code of my pipe is this</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>export class VideoPipe implements PipeTransform {
  
      constructor (private domSanitizer:DomSanitizer ){ }
  
      transform(url: string): any {
          return this.domSanitizer.bypassSecurityTrustResourceUrl( url );
      }
  
  }</code></pre>
  </div>
  </div>
  </p>
  
  <p>but when I tried to put the video URL , I get the error.  </p>
  
  <p>I asign the URL video in a switch case</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>case 'marketing':{
                this.bodyClass="background-marketing-text";
                this.btnClass="btnMarketing";
                this.video="https://www.youtube.com/watch?v=TTyFV-qhQtQ";
                break;
            }</code></pre>
  </div>
  </div>
  </p>