beek
beek

Reputation: 3750

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?

Upvotes: 1

Views: 958

Answers (2)

MMhunter
MMhunter

Reputation: 1441

Getting this error means your are trying to inject 'trusted' into your controller.

In fact you don't need to do that. Filters can be used without injection.

what you need to do is just call the .filter just like u define controllers.

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222582

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

Upvotes: 2

Related Questions