“allitems”包含在组合框中选择的类别的所有项目。那部分代码正常工作。
我将图像保存在数据库中作为每个项目的二进制数据。显示项目时,应呈现项目的图像。为此,我必须在渲染之前在ASP .Net控制器中保存项目的ID,因为“RenderImage”需要Item的ID。这是通过在AngularJS控制器中调用“saveItemId”来完成的。
但是图像的渲染非常难以预测。重复调用“saveItemId”但不调用RenderImage。
在AngularJS控制器或ASP .Net MVC控制器中调用方法/保存ID没有问题。
<div dir-paginate="r in allitems | filter:q | itemsPerPage: pageSize" current-page="currentPage" ng-init ='saveItemId(r.ID)' class="ag-fresh">
<div style="float:left">
<div class="col-xs-3">
<div style="width:200px;">
<div class="product-image-wrapper">
<div class="single-products">
<div class="productinfo text-center">
<img src="@Url.Action("RenderImage")" height="84" width="84"/>
<br/>
<h>{{r.Price}}</h>
<p>{{r.Name}}</p>
<button class="btn btn-default add-to-cart" ng-click="AddToCart(r.ID)">Add to cart</button>
{{successTextAlert}}
</div>
</div>
</div>
</div>
</div>
</div>
答案 0 :(得分:0)
似乎RenderImage是控制器范围内的js变量。如果是这样,则需要使用括号调用,例如{{RenderImage}}
尝试使用'ng-src'
代替'src'
属性,对于img元素,如下所述
https://docs.angularjs.org/api/ng/directive/ngSrc#!
答案 1 :(得分:0)
这适用于:
<img ng-src="data:image/jpeg;base64,{{arrayBufferToBase64(r.InternalImage)}}" height="84" width="84"/>
我将arrayBufferToBase64添加到角度控制器。