How to add class to specific table tr with angular ng-repeat
<p>In my HTML I have a table:</p>

<pre><code>&lt;table&gt;
  &lt;tr ng-class="vm.status" ng-repeat="item in vm.itemsList"&gt;
    &lt;td&gt;{{ item.name }}&lt;/td&gt;
    &lt;td&gt;
      {{ item.description }} - &lt;span ng-click="vm.disableRow()"&gt;Disable&lt;/span&gt;
    &lt;/td&gt;
  &lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>What I'm trying to accomplish is that when I click on Disable, I want to apply the class "disabled" to that specific tr only.</p>

<p>My current code applies that class to the entire table. I have other options such as remove that successfully removes the tr by using splice and $index.</p>

<p>I wondered if I need to implement $index to add class too but I can't think of how to do it.</p>

<p>In my controller:</p>

<pre><code>vm.disableRow = function() {
  vm.status = 'disabled';
}
</code></pre>

<p>If it matters, I need to only click once to apply that 'disabled' class. Once its disabled, I cannot change it so no need for a toggle on or off option.</p>