Angular 4不会加载我想要的字体

Question

我是角度四的新手，想要使用特定字体进行页面渲染。但角度根本不会加载字体，请记住，它加载其他人很好，但这一个特别是没有加载虽然相同的HTML和CSS工作完美时，与其他任何框架使用它们你们可以帮助我这里是代码： 我的component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-test-font',
  templateUrl: './test-font.component.html',
  styleUrls: ['./test-font.component.css']
})
export class TestFontComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

html：

 <p>
  test-font works!
</p>

css：

@font-face {
    font-family: GothamRegular;
    src: url("Gotham Light Regular.otf");
}

p {
    font-family: GothamRegular;
    font-size:50px;       
}

字体名称：Gotham Regular