user5839 user5839 - 1 year ago 87
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 Source

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