user5839 user5839 - 4 months ago 32
AngularJS Question

Angular Filters Unknown provider: trustedProvider <- trusted <- DashCtrl

I'm trying to implement this filter

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

<video ng-src="{{videoFile.path | trusted}}" controls="controls" autoplay> </video>


That I found here
External resource not being loaded by AngularJs

To allow video to play as I'm getting this error:
Error:
[$sce:insecurl] Blocked loading resource from url not allowed by $sceDelegate policy.


I can't get the filter to show, I get this error:


[$injector:unpr] Unknown provider: trustedProvider <- trusted <-
DashCtrl


I've tried adding that filter code in a few places like where the app is setup in index.js, but can't seem to get it to show up. Any ideas where I'm going wrong?

Answer

Change Like this,

Controller:

 routerApp.controller('trusted', ['$scope','$sce', function($scope,$sce) {   
      $scope.trustSrc = function(src) {
           return $sce.trustAsResourceUrl(src);
        }
       }
    ]);

HTML:

<video  ng-src="{{trustSrc(videoFile.path)}}" controls="controls" autoplay>   </video>

Sample Application

Comments