Tem algumas possíveis soluções:
EXEMPLO 1:
Uma forma usando o "jeito Angular", seria usar o ng-class
e alterá-lo dinamicamente, assim:
<li ng-class='classeDinamica' id='li-1'>{{item.item}}</li>
e na controller:
$scope.classeDinamica= 'nome-da-classe';
Mas isso irá alterar todos os elementos com classeDinamica
, e pelo que vi não é isso que você quer.
EXEMPLO 2
Para um elemento em especial, você pode usar um seletor, o que não é muito o "jeito angular", mas funciona:
angular.element(document.querySelector('#li-1')).addClass('nome-da-classe')
EXEMPLO 3
Uma outra solução mais elegante no "jeito angular" é usar uma expressão lógica com ng-class
usando o elemento ou o próprio objeto que foi feito o binding, no seu exemplo item:
<li ng-class="{'nome-da-classe': item.selecionado == true}" >{{item.item}}</li>
e na controller, já que você sabe qual o elemento (usei o índice x):
$scope.itens[x].selecionado = true;
Isso irá aplicar a classe quando o atributo selecionado do item seja igual a true
.
EXEMPLO 4
Por fim, se for somente um item selecionado em vários, e como você disse que tem o $index
, você pode criar um valor no $scope
pra guardar o elemento selecionado, baseado no $index
e fazer como no elemento anterior de um ng-class
condicional, assim:
<li ng-class="{'nome-da-classe': $index == itemSelecionado}" >{{item.item}}</li>
e finalmente na controller:
$scope.itemSelecionado= $index;
Alguma dessas soluções deve te ajudar