Binding an image tag with AngularJS

Question

I'm trying to update a div with an image and a link when a certain function is called and updates the imagesobject.

Here's what I have:

<a ng-bind="images[0]" ng-href="{{images[0].link}}"><img ng-bind="images[0]" ng-src="{{images[0].url || '' }}"></a>

On the controller:

$scope.upload = function (file, pos) {
    $scope.images[parseInt(pos)] = file;
    $scope.images[parseInt(pos)].url = 'http://i.imgur.com/ik9xqXp.jpg?1'
};

This function is called when the user submits an image.

However, when the images object updates, instead of an image, I get the string "[object File]

What am I doing wrong?

Could you please show the controller where you are updating the images object — Naga Sandeep
– Naga Sandeep, Commented Feb 22, 2016 at 17:06
It looks like just a ReferenceError. You want to access certain data but is accessing another instead, as @NagaSandeep said, give us a little bit of code as example. — user2434658
– user2434658, Commented Feb 22, 2016 at 17:08
I edited my post with the controller method that updates the images array — Milena Araujo
– Milena Araujo, Commented Feb 22, 2016 at 17:15
Also, why are you using ng-bind - I'm pretty sure ng-src does two-way binding already. — Foreign Object
– Foreign Object, Commented Feb 22, 2016 at 17:18

Foreign Object · Accepted Answer · 2016-02-22 17:26:52Z

2

Remove ng-bind and just use ng-src. ng-src already handles two-way binding.

answered Feb 22, 2016 at 17:26

Foreign Object

1,64011 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Binding an image tag with AngularJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related