Ionic 3 中的 Videogular2 Ima 实现答案

【问题标题】：Videogular2 Ima implementation in Ionic 3Ionic 3 中的 Videogular2 Ima 实现
【发布时间】：2017-06-06 07:46:24
【问题描述】：

我在 Ionic 3 上使用 Videogular 2。我按照本教程 (https://videogular.github.io/videogular2/modules/ima-ads/) 进行实施。但是，当 Videogular 尝试在 VgImaAds.loadAds 方法上加载广告时，它会给出此错误“未定义 googletag”。我已经导入了 App.module.ts 中需要的每个模块。这里是 App.module.ts 中的导入。

imports: [
IonicModule.forRoot(MyApp,{
  backButtonText:'',
  backButtonIcon:'arrow-back',
  iconMode:'md',
  modalEnter: 'modal-slide-in',
  modalLeave: 'modal-slide-out',
}),
IonicStorageModule.forRoot(),
BrowserModule,
VgCoreModule,
VgControlsModule,
VgOverlayPlayModule,
VgBufferingModule,
VgImaAdsModule]

这是我页面的组件 html。

 <ion-content>
    <vg-player id="demo-player">
        <vg-ima-ads
            [vgCompanion]="'companion-ad'"
            [vgCompanionSize]="[728, 90]"
            [vgNetwork]="'6062'"
            [vgUnitPath]="'iab_vast_samples'"
            [vgAdTagUrl]="'http://pubads.g.doubleclick.net/gampad/ads?sz=640x360&iu=/20277799247/Tv8-App-Preroll&impl=s&gdfp_req=1&env=vp&output=vast&unviewed_position_start=1&url=[referrer_url]&description_url=[description_url]&correlator='"
            [vgSkipButton]="'.skip-button'">
        </vg-ima-ads>

        <video [vgMedia]="media" #media id="singleVideo" preload="auto" crossorigin>
            <source [src]="liveStreamLink" type="application/x-mpegURL">
        </video>
    </vg-player>
    <div class='skip-button'>custom skip ad button</div>
    <div id="companion-ad"></div>
</ion-content>

另外，我在 index.html 的头部添加了标签。但显然，它在 VgImaAds.loadAds 上找不到该脚本的 googletag 属性。我该怎么办？

【问题讨论】：

标签： angular cordova ionic-framework videogular

【解决方案1】：

您需要在 index.html 中声明 ima 脚本之前初始化 googletag 属性

<script>
    var googletag = googletag || {};
    googletag.cmd = googletag.cmd || [];
    (function() {
    var gads = document.createElement('script');
    gads.async = true; gads.type = 'text/javascript';
    gads.src = 'https://www.googletagservices.com/tag/js/gpt.js';
    var node = document.getElementsByTagName('script')[0];
    node.parentNode.insertBefore(gads, node);
    })();
</script>

【讨论】：