Using ng-attr-href from angular to direct user interaction

Question

So what I am trying to do is for an icon (link), the user will have already logged on and there is a property identified that is true or false. Based on whether that property is true or false, when the user clicks that icon (link), it will take them to one of 2 pages. So looking at different directives within angular, thought I could use ng-switch, but that doesn't seem viable so I thought ng-attr-href could do it. Trying something like (this is pseudo code):

<a href="somepage.html" ng-attr-href="object.value: false | goto: "otherpage.html""><span></span></a>

So this is like an if/else where when user clicks icon and that value true, they go one place, but if false, they go elsewhere. My difficulty is structuring that and how/where the else goes.

Is there a better way to do this than I am thinking based on what I shared?

Thanks much.

Adding to, where could this be wrong?:

                    <a ng-href="{{ ppt.Globals.value == 'false' '#/claimEnter' : '#/clearSwipe' }}">
                        <img src="ppt/assets/toolIcons/submiticon.svg" >
                        <p>Submit a Claim for Reimbursement</p>
                    </a>

charlietfl · Accepted Answer · 2015-09-15 21:49:44Z

3

Can use a ternary within a {{}} expression in ng-href

<a ng-href="{{object.value ? 'somepage.html' : 'otherpage.html'}}">

answered Sep 15, 2015 at 21:49

charlietfl

172k14 gold badges125 silver badges154 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Mark Over a year ago

Is the "?" mean to be the property? so object.value == 'false' ? 'somepage.html' : ..... ?

Mark Over a year ago

Added some additional detail hoping to get further input.

Fernando Pinheiro · Accepted Answer · 2015-09-16 03:52:38Z

0

Put a function inside your controller to provide the value, then call it inside the ng-href. This type of decision of which link to go is the controller's responsibility.

ng-href="whereToGo(object.value)"

answered Sep 16, 2015 at 3:52

Fernando Pinheiro

1,8262 gold badges18 silver badges21 bronze badges

4 Comments

Mark Over a year ago

value is the property in this case. so is {{ object.property }} . That said, I understand the controller's responsibility. Just not sure I am understanding the syntax within the view as labeled. Meaning, so you saying that {{ function in controller ? whereToGo : another whereToGo }}. Do you see where I am lost?

Fernando Pinheiro Over a year ago

I dont see why you are struggling with this... but the ternary operator could be used... but in this case I would go with the ng-click instead of ng-href

Mark Over a year ago

I am trying to understand what the '?' operator in there is supposed to do within the tenary. Guess it is trying to provide an 'if'. How would the ng-click go into this with an 'if'?

Fernando Pinheiro Over a year ago

The ? operator works as an if... object.value ? "url1" : "url2"

Collectives™ on Stack Overflow

Using ng-attr-href from angular to direct user interaction

2 Answers 2

2 Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related