How To Load HTML5 Video Element In Ionic 2

I have been trying to display a list of videos from my server and im facing some difficulties. This is how the app looks like.

This is my html code

      <ion-item *ngFor="let video of recentVideos">
        <ion-thumbnail item-left (click)="openVideo(video)">
            <source [src]="video.fileUrl" type="video/mp4">
        <div (click)="openVideo(video)">
          <h2>{{ video.title }}</h2>
          <p>{{ video.description }}</p>
        <button ion-button clear item-right icon-only (click)="showPopoverMenu($event, video)">
          <ion-icon name="more"></ion-icon>

I dont understand why its displaying like that. The video plays fine, am using the ionic native streaming media plugin. Can anybody see why the video displays as such ?