HTML5视频WebVTT文件未加载-Angular2

我试图加载一个.vtt文件来显示视频中的章节，但它似乎没有加载。我在Angular2工作，目前在本地（localhost）工作

这是我的组件html：

<video #vid autoplay loop style="width:300px; height:200px">
  <source src="/video/dust_01.mov">
  <track #chapters kind="subtitles" src="/video/chapters.vtt" label="Chapters" srclang="en">
</video>

我的vtt文件是一个简单的文件，取自我在网上找到的一个示例（我修改了时间，因为我的视频只有一秒钟长）：

WEBVTT
00:00.100 --> 00:00.300
我们在纽约市
00:00.600 --> 00:00.900
我们实际上在路森酒店，就在街对面
00:01.000 --> 00:01.800
来自美国自然历史博物馆

如果我检查控制台，textTrack提示是空的

@ViewChild('chapters') chapters: ElementRef;
@ViewChild('vid') vid: ElementRef;

ngAfterViewInit() {
   console.log('display chapters');
   console.log(this.chapters);
   console.log(this.vid);
}

WEBVTT

00:00.100 --> 00:00.300
<v Roger Bingham>We are in New York City

00:00.600 --> 00:00.900
<v Roger Bingham>We’re actually at the Lucern Hotel, just down the street

00:01.000 --> 00:01.800
<v Roger Bingham>from the American Museum of Natural History