我想播放存储在我的sails服务器中的歌曲.路径为http：// localhost：4000 / images / 123.mp3.
在前端,我使用ng-repeat列出来自服务器的歌曲.
<div ng-repeat="tones in ringTones track by $index">
<div>
<i ng-show="playpause" class="fa fa-play-circle" ng-click="playpause=!playpause" onclick="plays(event);"><audio id="audio_{{$index}}" ng-src="tones.tonePath"></audio></i>
<i ng-show="!playpause" class="fa fa-pause" ng-click="playpause=!playpause" onclick="stop(event);"></i></div>
</div>
此音频源导致外部资源问题
<audio ng-src="tones.tonePath"></audio>
在角度控制器中,我正在使用$sce
$http.get("http://localhost:4000/songs/find").success(function(data){
$rootScope.ringTones=data;
$rootScope.ringTones.push($sce.trustAsResourceUrl(data[0]));
}).error(function(data){
console.log('ERROR');
});
错误是：
Error: [$sce:itype] Attempted to trust a non-string value in a
content requiring a string: Context: resourceUrl
没有使用导致的$sce
Error: [$interpolate:interr] Can't interpolate: tones.tonePath Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy. URL
这是我的服务器JSON
[{
"toneName": "2","aboutTone": "2","duration": 2,"tonePath": "http://localhost:4000/images/234.mp3","createdAt": "2015-08-03T15:40:58.227Z","updatedAt": "2015-08-03T15:40:58.227Z","id": "55bf8b8a77efb94b32b158c0"
},{
"toneName": "3","aboutTone": "3","duration": 3,"tonePath": "http://localhost:4000/images/123.mp3","createdAt": "2015-08-03T15:45:16.120Z","updatedAt": "2015-08-03T15:45:16.120Z","id": "55bf8c8c77efb94b32b158c1"
}
]
然后如何在我的ng-repeat中播放外部mp3.帮我.
解决方法
我找到了解决方案
External resource not being loaded by AngularJs
External resource not being loaded by AngularJs
app.filter('trusted',['$sce',function ($sce) {
return function(url) {
return $sce.trustAsResourceUrl(url);
};
}]);
然后在ng-src中指定过滤器：
<audio ng-src="{{tones.tonePath | trusted}}" /> </audio>
谢谢你的回复.
