URL structure breaks ng-src?

Question

I am just trying to put a path and file extension around an expression ng-src like so:

<iframe src="'path/' + pattern.anchor + '.html'">

which would ideally resolve to:

<iframe src="path/name.html">

if pattern.anchor is set to "name". I have no problem with the expression showing up elsewhere in my template. If I leave src="{{pattern.anchor}} then I get src="name", which is great but of course not what I need.

Any reason why this is not working?

You meantioned `ng-src`, why are you still using `src` as the attribute instead of `ng-src`? Using `` instead may fix your issue. Also: http://stackoverflow.com/questions/20045150/angular-js-how-to-set-an-iframe-src-attribute-from-a-variable — Liam Gray, Aug 31 '15 at 22:58

score 1 · Accepted Answer · answered Aug 31 '15 at 22:59

1

Try

<iframe src="{{ 'path/' + pattern.anchor + '.html' }}">

or create the path and assign it to a $scope variable and just point it at that.

You might want to actually use ng-src instead of src. Using src doesn't know to use ng-src, and ng-src will be more reliable, if it works for iframes, which I haven't confirmed.

answered Aug 31 '15 at 22:59

Timothy

1,198
3
10
30

Thanks, used ng-src and your suggested code and now I'm golden. Much appreciated. – Bice Sep 01 '15 at 14:57

URL structure breaks ng-src?

1 Answers1