Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/angularjs/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Angularjs $sce:itype试图信任需要字符串:Context:resourceUrl的内容中的非字符串值_Angularjs_Angularjs Ng Repeat_Sails.js_Ngsanitize - Fatal编程技术网

Angularjs $sce:itype试图信任需要字符串:Context:resourceUrl的内容中的非字符串值

Angularjs $sce:itype试图信任需要字符串:Context:resourceUrl的内容中的非字符串值,angularjs,angularjs-ng-repeat,sails.js,ngsanitize,Angularjs,Angularjs Ng Repeat,Sails.js,Ngsanitize,我想播放存储在我的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=!

我想播放存储在我的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>
错误是:

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中播放外置mp3。帮帮我。

我找到了解决方案:

然后在ng src中指定过滤器:

   <audio 
        ng-src="{{tones.tonePath | trusted}}" />
    </audio>

感谢您的回复。

//首先从api获取数据
//first Take data from api 

$scope.Data= JSLINQ(data.Data).Select(function (Item) { return Item; })                    

//Map data as trustable to scope
$scope.Data.items.map(function (i) {
                     i.Header1 = $sce.trustAsHtml(i.Header1);     
                 });

//UI bind modal data

<p ng-bind-html="x1.Header1 " ng-show="x1.Header1 != null"></p>
$scope.Data=JSLINQ(Data.Data).Select(函数(项){returnitem;}) //将数据映射为可信任范围 $scope.Data.items.map(函数(i){ i、 Header1=sce.trustAsHtml(即Header1); }); //用户界面绑定模式数据


从服务器返回的数据是什么?“,”如下所示。需要将其解析为数组。`data.split(',')[0]`为什么需要拆分数据?请解释一下,数据是以一个大字符串的形式返回的,因此,如果您在每个逗号处将字符串拆分为一个数组,那么您将数据作为一个数组,您可以选择该数组的第一个、最后一个、第n个索引。
  app.filter('trusted', ['$sce', function ($sce) {
        return function(url) {
            return $sce.trustAsResourceUrl(url);
        };
    }]);
   <audio 
        ng-src="{{tones.tonePath | trusted}}" />
    </audio>
//first Take data from api 

$scope.Data= JSLINQ(data.Data).Select(function (Item) { return Item; })                    

//Map data as trustable to scope
$scope.Data.items.map(function (i) {
                     i.Header1 = $sce.trustAsHtml(i.Header1);     
                 });

//UI bind modal data

<p ng-bind-html="x1.Header1 " ng-show="x1.Header1 != null"></p>