如何在Angular中引入AliPlayer

1、可以参照官网H5相关的教程

2、在index.html页面中引入：

  <script src="https://g.alicdn.com/de/prismplayer/2.8.2/hls/aliplayer-vod-anti-min.js"></script>
  <link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" />
  <script type="text/javascript" charset="utf-8" src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-h5-min.js"></script>

版本号处改为自己想使用的版本号

3、在需要使用Aliplayer的页面的HTML代码中加入

<div class="prism-player" id="player-con"></div>

对应TS页面中的AfterViewInit事件中加入

    // 摘自阿里云DEMO
    this.player = new Aliplayer({
        "id": "player-con",
        "source": "//player.alicdn.com/video/aliyunmedia.mp4",
        "width": "100%",
        "height": "500px",
        "autoplay": true,
        "isLive": false,
        "cover": "//xxx.xxxx.com/xxx.jpg",
        "rePlay": false,
        "videoHeight": "600",
        "playsinline": true,
        "preload": true,
        "autoPlayDelay": "5",
        "autoPlayDelayDisplayText": "这是标题",
        "language": "en-us",
        "controlBarVisibility": "hover",
        "videoWidth": "800",
        "useH5Prism": true
      }
    );

注：在此踩了个坑，把上面的内容加在了构造中，结果报了『没有为播放器指定容器』的错误，网上查到的基本都是Vue相关的答案。而后，想到没有指定容器，即是容器还没有初始化，因此移至AfterViewInit中进行初始化。