$sce:itype Tenté de faire confiance à un non-valeur de chaîne dans un contenu nécessitant une chaîne de caractères: Contexte: resourceUrl

Je veux jouer des chansons stockées dans mes voiles serveur. Chemin d'accès est http://localhost:4000/images/123.mp3.

En front-end, je suis en utilisant ng-repeat à la liste des chansons de serveur.

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

Cette source audio causer des ressources externes problème 

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

angulaire contrôleur, je suis en utilisant $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');
 });

D'erreur est : 

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

Sans l'aide de $sce qui causent 

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

C'est mon JSON à partir du serveur

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

Puis comment jouer mp3 externe dans mon ng-repeat. M'aider.

Qu'est-ce que les données depuis le serveur?
localhost:4000/images/123.mp3", "localhost:4000/images/234.mp3" comme ceci.
Il doit être analysée dans un tableau.` données.split(',')[0] `
pourquoi faut-il diviser les données? merci de m'expliquer
Les données sont de retour comme une chaîne de caractères, donc si vous diviser la chaîne en un tableau à chaque virgule, puis vous avez les données dans un tableau et vous pouvez choisir le prénom, le n-ième de l'index de ce tableau.

OriginalL'auteur Aravinth | 2015-08-04

  1. 5

    J'ai trouvé la solution :
    Ressource externe qui n'est pas chargé par AngularJs

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

    Spécifiez ensuite le filtre en ng-src:

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

    Merci pour la réponse.

    OriginalL'auteur Aravinth

  2. 0
    //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>
    merci de mettre un peu de description sur votre code.

    OriginalL'auteur user8906569