I need to be able to call a function in order to run code to dynamically retrieve the source of an image. The following code snippet shows an example of what I want:
<!-- "myFunction" exists in the current scope -->
<img ng-src="myFunction()" />
I'm sure this has to be simple but I just can't find anything in the ng-src documentation! Anyone else ever hit this?
Thanks in advance!
The Directive (Example based on answers)
Others recommended a directive. I can't post client code so I wrote a short example of what that would could look like in plunker (see here). The core directive itself is:
app.directive("imageSource", function (){
return { link: function (scope, element, attrs){
element.attr("src", scope.imageUrlArray[attrs.imageSource]);
}
};
});
I know that what I have here as an example could probably just be done with the ng-repeat using the variable in an ng-src but it serves as an example of what a directive would look like if one were necessary.
ng-src
is a directive, right. Your calling a directive to call a function. Why? Why not simply write a custom directive that returns what myfunction does. It'd be a whole lot neater.