Angularjs variable value is not updating

Question

I am using angular with bootstrap modal,i have a json stored in a scope variable products in a controller as follow

controllers.productController = function($scope) {
$scope.products = {"meta": {"total_count": 3}, "objects": [{ "id": 3, "image": "/media/products/1/Product007_image.JPEG", "image2": "/media/products/1/Product007_image2.JPEG",}, {"id": 4, "image": "/media/products/1/Product009_image.JPEG", "image2": "/media/products/1/Product009_image2.JPEG"},{"id": 13, "image": null, "image2": null}]}
$scope.fetchModal = function(index) {
   $scope.activeProd = index;
   $('#product_desc').modal();
}
}

index.html

    <div ng-controller="productController">
<div class="product-list">
    <span ng-repeat="product in products.objects" ng-click="fetchModal(index)" >{{ product.id }}</span>
    </div>
    <div id="product_desc">
    <img ng-src="{{products.objects[activeProd].image }}" />
    {{ products.objects[activeProd].id }}
    </div>
    </div>

it works all fine, the problem is that if i click on a product in product-list which has image it renders modal with image and then click on a product which have image value null i.e no image, in its model the previous product image still exist instead i should get nothing. I hope i am clear to my point

i observed that the ng-src is changing and assigning to null but the src attribute is not changing

so during the second click, id is changing but previous image is being displayed? — Subin Sebastian, Dec 14 '14 at 06:34
i will try making a fiddle , till then i just observered that the ng-src is changing and assigning to null but the src attribute is not changing — Sri Kanth, Dec 14 '14 at 09:52

score 1 · Accepted Answer · edited May 23 '17 at 10:27

I think your problem is that when you change the ng-src to null the older value is retained in the image source.

This is the proper angular behavior. You can find the details on this thread :

https://stackoverflow.com/a/22094392/1649235

If you go through this thread you will also find a workaround i.e. don't put your image path as null where it is supposed to be empty, put it equal to '//:0'.

Angularjs variable value is not updating

1 Answers1