Ionic 1 - Versteckt eine Schaltfläche, nachdem sie gedrückt wurde

Question

Ich versuche, die Schaltfläche "Gefällt mir" zu verbergen, nachdem sie auf meiner ionischen mobilen Anwendung gedrückt wurde. Aber anstatt nur diesen Knopf zu verstecken, versteckt er stattdessen alle ähnlichen Knöpfe. Wie kann ich nur 1 Taste einzeln ausblenden anstatt alles zu verstecken? Hier ist mein Code, den ich versucht habe zu implementieren.

activities.html:

<div class="item item-text-wrap" ng-repeat="activities1 in activities" id = $index> 
     <div> 
    Seen on: {{activities1.viewedDate}} 
     <br> 
     {{activities1.title}} 
      </div> 
      <iframe width="420" height="315" src="{{activities1.url}}"></iframe> 
      <div class="item item-input-inset"> 
         <button class="button button-full button-balanced" ng-click="invertLike(activities1);" ng-hide="ShowDiv"> 
          Like! 
         </button> 
       <button class="button button-full button-assertive" ng-click="Dislike(activities1);" ng-hide="ShowDiv2"> 
          Unlike! 
         </button> 
        </div> 
      </div> 

Controller.js:

 database.ref('/activitiesInvite/' ).orderByChild("name").equalTo(username).on('value', function(activitys){ 
     $scope.activities = activitys.val(); 


      $scope.invertLike = function(index) { 
      var id = index.id; 

firebase.database().ref('activitiesInvite').orderByChild("id").equalTo(id).on("value", function(snapshot) 
     { 
    { 
      var key; 
     $scope.check = snapshot.val().interest; 
     console.log($scope.check); 


    snapshot.forEach(function (childSnapshot) { 
     key = childSnapshot.key; 
    }) 
    if(key) 
    { 
     firebase.database().ref('/activitiesInvite/' + key).on("value", function(test) 
     { 

      firebase.database().ref().child('/activitiesInvite/' + key) 
      .update({ interest: "user has liked", }); 

       if($scope.check != "") 
        { 
         $scope.ShowDiv = true; 
        }    
     }) 
    } 
     } 

Jede Hilfe wird sehr geschätzt.

Answer 1

Das Problem tritt möglicherweise auf, da die Schaltflächen Modelldaten gemeinsam nutzen. Sie können einen untergeordneten Controller hinzufügen und die Schaltflächen umschließen. Das wird dein Problem lösen. Siehe die vollständige Beispielcode in https://plnkr.co/edit/eVgedv9WFGmKewcI7j6C?p=preview

//Main Module, Main Controller 
angular.module('myApp', []).controller('MainCtrl', function($scope) { 
    $scope.activities = [{ 
    title: 'Jani', 
    url: 'www.google.com', 
    viewedDate: new Date().toLocaleDateString("en-US") 
    }]; 
    $scope.ShowDiv = false; 
    $scope.ShowDiv2 = false; 
}) 
//Child Controller (Isolate the Scope of the variables from Parent Controller) 
.controller('ChildCtrl', function($scope) { 
    $scope.invertLike = function(activities1) { 
    //Scope Inherited From Parent 
    $scope.ShowDiv = true; 
    }; 
    $scope.Dislike = function(activities1) { 
    //Scope Inherited From Parent 
    $scope.ShowDiv2 = true; 
    }; 
});