如何在"ng-src"中调用函数? [英] How to call a function in "ng-src"

问题描述

我需要能够调用一个函数，以便运行代码来动态检索图像的来源.以下代码段显示了我想要的示例:

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()" />

我敢肯定这必须很简单，但是在 ng-src文档中什么都找不到！还有其他人打过这个吗?

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?

提前谢谢！

指令(基于答案的示例)

其他人建议使用指令.我无法发布客户端代码，因此我写了一个简短的示例，说明了在plunker中的外观(请参阅此处).核心指令本身是:

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]);
    }
  };
});

我知道我在这里作为示例可能只是使用ng-src中的变量使用ng-repeat来完成的，但它可以作为指令将看起来的示例就像有必要的话.

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.

推荐答案

<img ng-src="{{myFunction()}}" />

小提琴

这篇关于如何在"ng-src"中调用函数?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！