Set different hyperlink for same tag (Using AngularJs)

问题

I have a very weird query. Searched a lot online but couldnot find a correct solution.

<ul class="dropdown-menu">
                    <li><a ng-model="data" href="Pre.html" target="_blank">Pre</a></li>
                    <li><a href="Post.html" target="_blank">Post</a></li>
</ul>

I have a simple dropdown menu with Pre and Post as its list in the dropdown. When user clicks Pre, pre.html page opens, when he clicks post, post.html page opens.

this is normal operation. Now i want to do this.

If user clicks on the hyperlink 'Pre', assuming $scope.data= fasle at the controller side, then Pre.html page should open once

if $scope.data = true, then instead of Pre.html, i want the hyperlink to open some other html. for e.g. block.html.

how to ensure that depending on the condition in controller, the particular html page should display.

<ul class="dropdown-menu">
                    <li><a ng-model="data" href="Pre.html OR Block.html" target="_blank">Pre</a></li>
                    <li><a href="Post.html" target="_blank">Post</a></li>
</ul>

As seen above href="Pre.html OR Block.html", means i want to show either of the two pages depending on the controller side data

回答1:

You could use ngHref and write something like:

<a ng-href="{{ data ? 'Pre.html' : 'Block.html' }}" target="_blank">Pre or Block</a>

回答2:

Why not have two different tags toggle able using ng-if based on the controller's value. You could do something like,

<li>
<a ng-if="data" ng-model="data" href="Block.html" target="_blank">Block</a>
<a ng-if="!data" ng-model="data" href="Pre.html" target="_blank">Pre</a>
</li>
<li><a href="Post.html" target="_blank">Post</a></li>

Then some logic in the controller to change from true to false.

来源：https://stackoverflow.com/questions/36412717/set-different-hyperlink-for-same-a-tag-using-angularjs

标签

javascript