大佬教程收集整理的这篇文章主要介绍了角度2 – 如何嵌入YouTube视频，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
<div *ngIf="topic.video">
<div class="video-container">
<iframe width="300" height="169" src="topic.video.url" style="border:0"></iframe>
</div>
</div>
问题：angular将输出src =“localhost：// 8001”而不是src =“https://www.youtube.com/embed/hr4BbdUiTUM”
这可能有什么问题？
更新2
这是Gunter回答之后的结果.
import { Component,OnInit,Pipe,Sanitizer } from '@angular/core'; import { Dataservice } from '../../shared/data'; @Component({ template: ` <div class="subheader">Feed</div> <div *ngFor="let topic of topics; let index = index; trackBy: trackByFn"> <div *ngIf="topic.type == 'discussion'"> <div *ngIf="topic.video"> <div class="video-container"> <iframe src="{{sanitizer.bypassSecurityTrustresourceUrl(topic.video.url)}}" ></iframe> </div> </div> </div> </div> ` }) export class CompanyComponent implements OnInit { constructor( private sanitizer:Sanitizer,private dataservice: Dataservice ) {} ngOnInit() { this.topics = this.dataservice.topics; } }
我仍然有这个错误
company.ts?ac6a:121 Error: Uncaught (in promisE): Error: Error in ./CompanyComponent class CompanyComponent - inline template:29:41 caused by: unsafe value used in a resource URL context (see http://g.co/ng/security#xss) Error: unsafe value used in a resource URL context (see
[src]="topic.video.url"
要么
src="{{topic.video.url}}"
如果DOM清理程序删除了URL,则可以使用In RC.1 some styles can’t be added using binding syntax中所示的管道
import { Pipe,DomSanitizer } from '@angular/core'; @Pipe({name: 'saferesourceUrl'}) export class SaferesourceUrl { constructor(private sanitizer:DomSanitizer){} transform(url) { return this.sanitizer.bypassSecurityTrustresourceUrl(url); } }
[src]="topic.video.url | saferesourceUrl"
你也可以申请
this.myUrl = this.sanitizer.bypassSecurityTrustresourceUrl(this.topic.video.url);
并绑定到此
[src]="myUrl"
但管道更可重复使用.
以上是大佬教程为你收集整理的角度2 – 如何嵌入YouTube视频全部内容，希望文章能够帮你解决角度2 – 如何嵌入YouTube视频所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。