ändern img, dass in der Klasse in Klasse in ID

Question

Ich lese darüber, aber immer noch kann ich es nicht funktionieren. Ich habe ein Bild (leeres Herz), das ich zu einem anderen Bild (volles Herz) wechseln möchte, um anzuzeigen, dass es zur Wunschliste hinzugefügt wurde.

hier ist mein Code:

<tbody class="mainImgs"> 
    <div ng-repeat="party in showtop5" ng-class=party.name> 
     <img ng-src="{{party.image}}"> 
     <h2 id="title">{{party.title}}</h2> 
     <h3 id="description">{{party.description}}</h2> 
     <button href="#" class="imageClick" ng-click="click(party.title, party.description, party.image)"> 
     <img ng-src="../images/emptyHeart.png" id="heart" click="myFunction(party.name, imageClick)"> 
     </button> 
     <img ng-src="{{party.img}}" id="pace"> 
    </div> 
</tbody> 

und mein Skript:

function myFunction(myclass1, myclass2){ 
     document.getElementByClass(myclass1).getElementByClass(myclass2).getElementById("heart").src = "../images/fullHeart.png"; 
    } 

, was habe ich falsch gemacht? ohne die Klasse zu senden - und versuchte Bild zu finden nur von id - t funktioniert nur für das erste Objekt Herz, die

Answer 1

gedruckt wird, denke ich, wenn es nur um Bild zu ändern, dann kann es ziemlich geradlinig behandelt werden:

In html

<button href="#" class="imageClick" ng-click="click(party.title, party.description, party.image)"> 
    <img ng-src="{{imgPath}}" id="heart" ng-click="myFunction(party.name, imageClick)"> 
</button> 

In Controller:

$scope.imgPath = "../images/emptyHeart.png"; 
$scope.myFunction= function (name,imageClick){ 
    // use promise to monitor the server response of adding product to Wishlist 
    ("YOUR_PROMISE_CALL").then(
    function(success){ 
     $scope.imgPath = "../images/fullHeart.png"; // Bingo !! 
    }, 
    function(error){ 
     // take appropriate action 
    }, 
) 
}