title: AngularJS - Remove table row after object destroyed
body: <p>I have an AngularJS app that returns a list of json objects and I iterate through those objects and place them into a table.</p>
  
  <p>Each item on the table has a "Delete" button with an ng-click method:</p>
  
  <pre><code>&lt;td&gt;&lt;a ng-click="testButton()" class="btn btn-danger btn-mini"&gt;Delete&lt;/a&gt;&lt;/td&gt;
  </code></pre>
  
  <p>I am using ng-resource to delete the object - and that works fine.</p>
  
  <p>However, I want to also be able to hide (or remove) the row that houses the object and the delete button after it is deleted - preferably by using <strong>JQuery</strong>.</p>
  
  <p>Here is my destroy method:</p>
  
  <pre><code>$scope.destroyThing = function() {
          $scope.thing= this.thing;
          $scope.thing.$destroy();
          $(this.thing).closest("tr").hide(); // something like this maybe
      }
  </code></pre>
  
  <p>The method destroys the object just fine - it just doesn't remove the row... so I tried logging the object returned when I click the button:</p>
  
  <pre><code>$scope.testButton = function() {
          console.log(this);
      }
  </code></pre>
  
  <p>That seems to return the angular Scope object itself - but I can't find a way to access any of the DOM elements that it relates to.</p>
  
  <p>Here is a screenshot to show you the object returned from the testButton function - which is triggered by clicking the button of course:</p>
  
  <p><img src="https://i.stack.imgur.com/HjR6I.png" alt="enter image description here"></p>
  
  <p><strong>How can I access DOM elements related to the Angular object with JQuery?</strong></p>
  
  <h2>EDIT</h2>
  
  <p>Here is the complete table row:</p>
  
  <pre><code>&lt;tr ng-repeat="franchise in franchises"&gt;
                  &lt;td ng-model="franchiseName"&gt;{{franchise.franchise_name}}&lt;/td&gt;
                  &lt;td ng-model="franchiseNumber"&gt;{{franchise.franchise_number}}&lt;/td&gt;
                  &lt;td&gt;&lt;a class="btn btn-mini"&gt;Edit&lt;/a&gt;&lt;/td&gt;
                  &lt;td&gt;&lt;a ng-click="destroyFranchise()" class="btn btn-danger btn-mini"&gt;Delete&lt;/a&gt;&lt;/td&gt;
  
              &lt;/tr&gt;
  </code></pre>