Добавить динамическое имя класса в angularjs

Question

У меня есть служба, которая возвращает ответ «состояние», состояние может быть либо «checkout», «deliver», «pending». Мне нужно добавить иконку в соответствии с этим состоянием, im новое для углового и очень ценно, если кто-то может направить меня к методу, который поможет мне выполнить эту задачу.

Answer 1

Есть несколько способов, которые вы могли бы добиться этого:

1. Вы могли бы использовать метод контроллера, чтобы помочь определить состояние и позвонить, если с вашей точки зрения:

контроллер:

$scope.applyClass = function(myObj) { 
    if (myObj.state === 'checkout') { 
     return 'checkout-class'; 
    } else if (myObj.state === 'delivered'){ 
     return 'delivered-class' 
    } else if (myObj.state === 'pending'){ 
     return 'pending-class'; 
    } 
} 

Просмотр:

<div ng-class="applyClass(myObj)">...</div> 

2. Кроме того, вы также можете сделать это без контроллера, только строки интерполировать состояние объекта (при условии, что myObj.state всегда возвращает либо контроль, доставлен, или в ожидании):

<div ng-class="{{myObj.state}}-class">...</div> 

Answer 2

Простое решение может быть как

controller("testCtrl",function($scope,someService){ 
$scope.state = someService.state(); 
    }) 

вид:

<div class="{{state}}-class">...</div>