Angular 2 http请求音频src无法播放

Question

我在音频src上获取并附加了数据，但它没有运行。

detail.component.ts

export class DetailComponent implements OnInit {
    @Input() detailName: string;
    @Output("playnhac") play = new EventEmitter();
     private linkmp3:string;
    constructor(private _http:Http) {

    }
ngOnInit() {
                    this._http.get('http://searchsong.azurewebsites.net/api/mp3File/'+this.detailName+'&type=128&key=minhtaitr')
        .map(res => res.json())
        .subscribe(
          data => {this.linkmp3=data

        })

        }

detail.component.html

<audio controls>

  <source type="audio/mpeg" src="{{linkmp3}}" >

</audio>

Answer 1

您不应在属性中使用插值，而应使用[attr.src]="..."。 如果没有此管道，您将无法设置此属性：

@Pipe({
    name: 'safe',
    pure: true
})
export class SafePipe implements PipeTransform
{
    private sanitizer:DomSanitizer;

    constructor(sanitizer:DomSanitizer)
    {
        this.sanitizer = sanitizer;
    }

    transform(url)
    {
        return this.sanitizer.bypassSecurityTrustResourceUrl(url);
    }
}