Question

我正在使用的项目通过用javascript编写的html在页面上呈现图像，如下所示：

imageHTML = "<div ng-click='showImage("+-1+", "+parentId+");' class='thumbnail'><img ng-src='{{parentImg}}' /></div>";

稍后会为

$scope.parentImg分配一个b64值，它会渲染得很好。我的问题是，当通过同一行代码渲染多个图像时，第一个图像会覆盖$ scope.parentImg，并且两个图像将具有相同的值，因此是相同的图像。

我目前正在尝试创建$ scope.parentImg作为对象，如下所示：

$scope.parentImage[idOfObject] = "";
$scope.parentImage[idOfObject] = b64Value;

然后在两次循环之后，$ scope.parentImage将如下所示：

Object
51255135: "base64 Stuff asdfsaafasdfsafsadfdsaf"
43214213: "base64 Stuff asdfasdfasdfsadfadsfadf"

所以，我的问题......如何将以下内容绑定到硬编码的html中？

<img ng-src="parentImage[idOfObject]">

此对象的值是预期的base64字符串，但绑定到ng-src不适用于分配动态键进行绑定。

Answer 1

使用ng-repeat是一种方法：

<div ng-repeat="image in parentImage"">
    <img ng-src="{{img}}">
</div>

Answer 2

您可以在角度属性值中使用表达式{{}}，如此

<img ng-src="{{parentImage[idOfObject]}}">

这是运行这个概念的例子：