视频ID的角度始终为null

我正在尝试在视频标签上调用load()。

HTML代码:

<div [ngClass]="{
   'file-upload-grid-row': isGridRowStylingApplied,
   'file-upload-grid-column': !isGridRowStylingApplied
}">
    <div id="test" class="file-drag-and-drop">
    <div class="card">
      <div></div>
      <div><button type="button" class="btn btn-primary" (click)="drop.showFileSelector()">Browse</button></div>
      <div><button type="button" class="btn btn-danger" (click)="onRemove()">Cancel</button></div>
    <div></div>
    </div>
    <div><ngx-dropzone class="custom-drop-zone size" [expandable]="true" (change)="onSelect($event)"
                       [disableClick]="true"
                       [multiple]="false" #drop>
    <ngx-dropzone-label [hidden]="!showDragAndDropText">{{dragAndDropText}}</ngx-dropzone-label>
    <ngx-dropzone-preview *ngFor="let file of allFiles" [removable]="true">
        <ngx-dropzone-label>{{ file.name }} ({{ file.type }})</ngx-dropzone-label>
    </ngx-dropzone-preview>

    <!-- for image preview -->
    <img *ngIf="isImageUploaded" [src]="fileURL">

    <!-- for video preview -->
    <video  *ngIf="isVideoUploaded"  id="my_video_1" controls><source [id]=fileURL [src]="fileURL"></video>

    <!-- for audio preview -->
    <audio *ngIf="isAudioUploaded" controls><source [src]="fileURL"></audio>

</ngx-dropzone>
  </div>
    </div>
    <div>
      <p class="text">
        <ng-content></ng-content>
      </p>
    </div>
</div>

Component.ts

const myVideo: any = document.getElementById('my_video_1');
    if (myVideo){
      console.log('came');
      myVideo.load();
    }

我的视频的值始终为空。谁能告诉我我做错了吗? 我正在使用Angular 8,并且使用了开源文件组件-ngx-dropzone来删除文件。