Make an href if condition is met in Angular

Question

I have different text that will be displayed in my template based on what gets returned from a service. Let's say: Initializing, Running, Done. In Angular, how do I make the text a link if the word matches Done?

$scope.status = // Initializing, Running, or Done based on service

In the template, I want to show

{{ status }}

but when the status is Done, I want a hyperlink to go the actual result. Do I need to use an ng-if, or is there a better way?

Answer 1

You can use ng-show and ng-hide to logically render what you want to show on your view.

In your case, you want to ng-show the link when status == 'Done' and ng-hide any other status when status == 'Done'

Here is a simple fiddle to illustrate https://jsfiddle.net/48fsbqvb/