url绑定的角度vg-player源问题答案

【问题标题】：Angular vg-player source problem with url bindingurl绑定的角度vg-player源问题
【发布时间】：2019-08-21 13:17:59
【问题描述】：

我在 Angular 视频播放器中的源绑定存在问题

我的变量campaign.campvideo 包含视频文件的url

campaign.campvideo 包含“/assets/media/CAMVXXXX.mp4”

在这种情况下：

<video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin >

     <source src="/assets/media/CAMVXXXX.mp4" type="video/mp4" >

</video>

有效！

但是当我尝试时

<video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin >
          <source  src={{campaign?.campvideo}} type="video/mp4" >
      </video>

没有用

它尝试不同的绑定：

[src] = campaign?.campvideo
[src] = {{campaign?.campvideo}}
[src] = "{{campaign?.campvideo}}"

编辑：我在哪里检索到活动数据

ngOnInit() {
    let id = this.route.snapshot.paramMap.get('id');

this.campaignService.getOneCampaign(id).then(
  (campaign: Campaign) => {
    this.campaign = campaign;
    this.unitcostvid = this.campaign.unitcost * this.campaign.durationvid;
    this.totalcost = this.unitcostvid * this.campaign.nbuser;
    console.log(campaign.campvideo); /*is good */
    return this.campaign;
  }
)

【问题讨论】：

campaign 数据是异步获取的吗？您能否提供有关“不起作用”的更多详细信息？是否是空白视频，控制台是否有错误等？
控制台没有错误...它是空白的。
如何获取campaign 数据？通过使用? 安全导航运算符，如果在构建模板时它未定义或为空，它不会抛出任何异常或错误。
是的，没有？当我使用我收到 ERROR TypeError: Cannot read property 'campvideo' of undefined 但是使用没有错误但没有视频
好的，这就是你的问题，在构建模板时数据不可用。包括? 只是意味着您的控制台不会抛出异常。您可以编辑您的原始帖子并将您的 ts 代码包含在您获取活动数据的位置吗？此外，如果您要使用 [src] 并绑定到源属性，则需要包含如下引号：[src]="campaign.campvideo"

标签： angular binding

【解决方案1】：

我在 HTML 中放了一个 *ngIf，它现在可以工作了！

<source *ngIf="campaign?.campvideo"  [src]=campaign?.campvideo type="video/mp4" >

谢谢大家^^

【讨论】：