img image angularjs base64 loading data-url

img - ng src image base64



Cargando imagen src usando una variable que contiene datos base64 en AngularJS (2)

Cargando imagen usando una variable que contiene datos base64 en AngularJS

Estoy tratando de encontrar la forma correcta de cargar una fuente de imagen desde una variable que contenga datos de imagen codificados en base64 (por ejemplo, extraído de un lienzo usando toDataURL(); ).

Al principio lo intenté así:

<img src="{{image.dataURL}}" />

donde la imagen es una variable de alcance con una variable dataURL contiene los datos de base64 . Esto realmente funciona bastante bien, el único problema es que recibo un error 404 en mi consola. Algo como esto:

GET http://www.example.com/%7B%7Bimage.dataURL%7D%7D 404 (No encontrado)

No es tan bonita. Cuando probé una solución de estilo más angular como esta:

<img data-ng-src="image.dataURL" />

Las imágenes no se están cargando en absoluto. Hice un violín que puedes encontrar HERE

¿Alguna sugerencia de cómo deshacerse de este error en mi consola?

EDITAR:

Gruff Bunny tenía razón. Este <img data-ng-src="{{image.dataURL}}" /> está funcionando ...

Solución de trabajo se puede encontrar HERE


Admito que pasé demasiado tiempo tratando de solucionar un problema similar,

mi problema era que tenía un refuerzo adicional aquí (ver tres llaves al final):

ng-attr-src="{{aad.form.imageBase64Temp}}}"


El contenido del ng-src debe interpolarse: intente esto:

<img data-ng-src="{{image.dataURL}}"/>