在HTML音频标记中提供动态URL

Question

我在html中使用音频标签以及角度js，其中我必须提供我想要播放的音频源，如下所示。

    <audio src="http://localhost/audio/221122/play/212223.mp3" 
    audio player controls 
    pre-load="none"></audio>

我只是想让这个URL动态化，其中221122和212223应该是一些变量，比如文件夹名称和媒体文件，它们可以有任何动态值。

任何人都可以帮我解决这个问题吗？我是否必须在控制器中写一些东西？

感谢。

Answer 1

在你的模板中：

<audio audio player controls 
    ng-src="http://localhost/audio/{{model.folderName}}/play/{{model.audioName}}"
    pre-load="none"></audio>

在您的控制器中：

$scope.model = {
    folderName: '221122',
    audioName: '212223.mp3'
}

来自Angular ngSrc directive文档：

“在src属性中使用{{hash}}之类的Angular标记无法正常工作：浏览器将使用文字文本{{hash}}从URL中获取，直到Angular替换{{hash}}中的表达式为止.ngSrc指令解决了这个问题。“