Przegubowe i tekst w angularjs

Question

Jest blokady i odblokować funkcje, które w HTML jest reprezentowana przez

<li><a ng:click="lock(selectedUser)"><i class="icon-lock icon"></i>Lock</a></li> 

i

<li><a ng:click="unlock(selectedUser)"><i class="icon-unlock icon"></i>UnLock</a></li> 

Unlock/Lock jest acutally wezwanie REST API

$scope.unlock = function(user){ 
    user.$unlock(); 
} 

$scope.lock = function(user){ 
    user.$lock(); 
} 

Jak mogę przełączać się między dwoma stanami w pliku angular.js? Chodzi mi o to, że kiedy blokada jest wykonywana i się powiodła, pierwsza opcja powinna być ukryta, a przycisk odblokowania powinien być widoczny.

selectedUser.enabled 

powraca 1 na odblokowany i 0 dla zablokowana.

Answer 1

Wystarczy użyć jednego li i ustaw klasę z ng:class:

HTML:

<li> 
    <a ng:click="toggleLock(selectedUser)"> 
    <i class="icon" ng:class="{ 'icon-lock': selectedUser.enabled, 'icon-unlock': ! selectedUser.enabled }"></i> 
    {{ selectedUser.enabled && 'Lock' || 'Unlock' }} 
    </a> 
</li> 

javascript:

$scope.toggleLock = function (user) { 
    user.enabled ? user.$lock() : user.$unlock(); 
} 

---

Aktualizacja: kątowa 1.1.5 dodano wsparcie dla operatorów trójskładnikowych, więc powyższe można ponownie zapisać jako:

{{ selectedUser.enabled ? 'Lock' : 'Unlock' }}