$sce:itype 试图信任需要字符串的内容中的非字符串值:上下文:resourceUrl [英] $sce:itype Attempted to trust a non-string value in a content requiring a string: Context: resourceUrl

问题描述

我想播放存储在我的帆服务器中的歌曲.路径为http://localhost:4000/images/123.mp3.

在前端，我使用 ng-repeat 列出来自服务器的歌曲.

 <div ng-repeat="$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>

此音频源导致外部资源问题

<audio ng-src="tones.tonePath"></audio>

在角度控制器中，我使用的是 $sce

$http.get("http://localhost:4000/songs/find").success(function(data){$rootScope.ringTones=数据；$rootScope.ringTones.push($sce.trustAsResourceUrl(data[0]));}).错误(函数(数据){console.log('错误');});

错误是:

错误:[$sce:itype] 试图信任一个非字符串值需要字符串的内容:上下文:resourceUrl

不使用 $sce 导致

错误:[$interpolate:interr] 无法内插:tones.tonePath错误:[$sce:insecurl] 阻止从 $sceDelegate 政策不允许的 url 加载资源.网址

这是我来自服务器的 JSON

<代码> [{"toneName": "2","aboutTone": "2",持续时间":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",持续时间":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.帮帮我.

解决方案

我找到了解决方案:AngularJs 未加载外部资源

 app.filter('trusted', ['$sce', function ($sce) {返回函数(网址){返回 $sce.trustAsResourceUrl(url);};}]);

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

 <音频ng-src="{{tones.tonePath | trust}}"/>

感谢回复.

I want to play songs stored in my sails server. Path is http://localhost:4000/images/123.mp3.

In front end, i'm using ng-repeat to list that songs from server.

 <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>

This audio source cause external resource problem

<audio ng-src="tones.tonePath"></audio>

in angular controller, i'm using $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 is :

Error: [$sce:itype] Attempted to trust a non-string value in a 
    content requiring a string: Context: resourceUrl

Without using $sce that cause

Error: [$interpolate:interr] Can't interpolate: tones.tonePath
Error: [$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.  URL

This is my JSON from server

 [{
    "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"
  }
]

Then how to play external mp3 in my ng-repeat. Help me.

解决方案

I found solution : External resource not being loaded by AngularJs

  app.filter('trusted', ['$sce', function ($sce) {
        return function(url) {
            return $sce.trustAsResourceUrl(url);
        };
    }]);

Then specify the filter in ng-src:

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

Thanks for response.

这篇关于$sce:itype 试图信任需要字符串的内容中的非字符串值:上下文:resourceUrl的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！