Trying to filter based on a table field from element outside table with AngularJS

Question

In the following codepen I am trying to filter data depending on which span is clicked. The text for the spans are All, Open, and Closed to show the Status of an IT Ticket. I am currently using a "filter:searchText" in the ng-repeat attribute that can successfully filter the data to show which tickets are still open. However, there are rows that have the word Open in their description but whose status is Closed. When I click on the span with Open I also get the Closed ticket that has the word Open in its description. How can I filter based only on the Status field? Thank you.

<div class="container" ng-app="myApp" ng-controller="myController">
  <div class="row">
    <div class="col-12">
      <div class="row">
        <div class="col-6 my-auto">
          <span ng-repeat="tab in tabs" ng-click="update(tab.value)">{{tab.label}}</span>
        </div>
        <div class="col-6 my-auto">
          <label class="my-auto float-right">Search:
            <input ng-model="searchText">
          </label>
        </div>
      </div>
      <div class="row table-responsive">
        <table id="searchTextResults" class="table table-striped">
            <tr>
                <th ng-click="sortBy('ID')">ID</th>
                <th ng-click="sortBy('Description')">Ticket Description</th>
                <th ng-click="sortBy('Status')">Ticket Status</th>
              <th>Edit</th>
            </tr>
          <tr>
                        <tr ng-repeat="ticket in tickets | filter:searchText | orderBy:sortField:reverseOrder">
              <td><a href="#">{{ticket.ID}}</a></td>
              <td><a href="#">{{ticket.Description}}</a></td>
              <td><a href="#">{{ticket.Status}}</a></td>
<td><button ng-click="openModal()" class="myBtn">Edit</button></td>
            </tr>
          </tr>
        </table>
      </div>
    </div>
  </div>
</div>

Answer 1

Here is how you would filter searchText by the object property Status.

filter:searchText:true:Status

https://docs.angularjs.org/api/ng/filter/filter

So if you wanted to pipe in two different filters to the same table. I would consider doing something like this.

<tr ng-repeat="ticket in tickets | filter:searchText | filter:var2:true:Status
  | orderBy:sortField:reverseOrder">