Make an href if condition is met in Angular


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?


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

Answered By – Clayton Goette

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published