Angular span conditional hover over text

Question

I am getting 3 values from the backend : isDone, isInProgress, isFailed and based on these 3 values, i need to change the hover over text of a span element in angularview. if the element is isDone or isInProgress, i have to show one icon with 2 different hover text. if the element is isFailed , i have to show an error message on the screen:

The code :

<span class="glyphicon glyphicon-refresh blue"                                                      
 title="In progress" ng-show="action.isInProgress"> </span>

How do i incorporate the IsDone in this span?

Answer 1

Just do this:

<span class="glyphicon glyphicon-refresh blue" title="{{ action.isInProgress ? 'Action is in progress' : 'Action is complete.'}}" ng-show="action.isInProgress||action.isDone"></span>