AngularJS - Disable ng-click if element has specific class

You cannot disable a list cause its not a interactive element can use ngClass to apply a specific class when disabled to make it appear disabled:

<li ng-class="{'disabled':condition}"ng-click="getRadius(5)">item</li>

You can use ng-if to remove those items completely from the list:

 <li ng-if="!condition" ng-click="getRadius(5)">item</li>
 <li ng-if="condition" >item</li>

If you use button tag as trigger instead of li, you can use ng-disabled directive to permit click by a condition. For example:

<ul class="cf" id="filter">
 <li><button ng-click="getRadius(5)" ng-disabled="current!=5">5 km</button></li>
 <li><button ng-click="getRadius(10)" ng-disabled="current!=10">10 km</button></li>
 <li><button ng-click="getRadius(25)" ng-disabled="current!=25">25 km</button></li>
 <li><button ng-click="getRadius(50)" ng-disabled="current!=50">50 km</button></li>
 <li><button ng-click="getRadius(100)" ng-disabled="current!=100">100 km</button></li>
</ul>

If you want, you can customize button style and you can show it like a standart text element.

.cf button {
  border: none;
  background: none;
}

// template
<ul class="cf" id="filter">
 <li ng-click="!clickLi[5] && getRadius(5)" class="current"><a href="#">5 km</a></li>
 <li ng-click="!clickLi[10] && getRadius(10)"><a href="#">10 km</a></li>
 <li ng-click="!clickLi[25] && getRadius(25)"><a href="#">25 km</a></li>
 <li ng-click="!clickLi[50] && getRadius(50)"><a href="#">50 km</a></li>
 <li ng-click="!clickLi[100] && getRadius(100)"><a href="#">100 km</a></li>
</ul>    


// controller
function MyController($scope) {
    $scope.clickLi = {
        5: true
    };

    $scope.getRadius = function(li_id) {
        $scope.clickLi[li_id] = true;
        console.log(li_id);
    };
}

A demo on JSFiddle.

Possible workaround: If you need a single selection you can add variable into the scope specifying which row is selected and generate your list with the ng-repeat, then you can add lazy checking on ng-click if current $index is equal to selected index, you can use the same condition to apply current class with ng-class.

For example:

app.js

$scope.selected = 0;
$scope.distances = [5, 10, 25, 50, 100];  

app.html

<ul class="cf" id="filter">
  <li ng-repeat = "distance in distances" ng-click="($index == selected) || getRadius(distance)" ng-class="{'current':($index == selected)}"><a href="#">{{distance}} km</a></li>
</ul>