AngularJS ng-repeat and video's ng-src

Question

I have a basic ng-repeat loop that displays my content but if I use ng-src for video tags it causes this error:

Error: [$interpolate:noconcat] Error while interpolating: http://localhost{{post.media}}

I know I can use a $sce service but I am not sure how to utilize it in the context of ng-repeat...

score 2 · Accepted Answer · edited May 23 '17 at 10:32

It has nothing to do with ngRepeat. It is Angular's SCE protecting you from a potentially unsafe practice.

1.) You could create a function in your controller that generates the URL:

var host = 'http://localhost/';
$scope.generateURL = function (media) {
    return host + media;
};

2.) Then, call it from the view:

... ng-src="{{generateURL(post.media)}}"

Take a look at this answer for more info on why the error occurs and what is SCE's purpose.

1 Answers1