CODEWITHSUNDEEP
javascriptandroidangularjsionic-frameworkcross-platform
FranzHuber23
FranzHuber23

Reputation: 4262

AngularJS open Link if condition

I want to check an if condition inside an href in AngularJS:

<a class="button button-block" href="if(cond){#/app/abc}else{nothing}" ng-click="doSomething()">Suchen</a>

where cond is a condition that can be true or false and the link shall only be openend if this condition is fullfilled.

Does anyone know if this is possible and if yes how?

Upvotes: 0

Views: 1066

Answers (2)

Naga Sai A
Naga Sai A

Reputation: 10975

To achieve your expected result with ng-if, you can use below option

<div ng-if="cond" ng-show="cond">
  <a class="button button-block" href="#/app/abc" ng-click="doSomething()" ng-model="cond">Suchen</a>
</div>
<a class="button button-block" href="nothing" ng-click="doSomething()" ng-hide="cond" ng-model="cond">abc</a>

JS:

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.cond='sai';// comment to see abc link with href= nothing and uncomment to show href with mentioned path
});

To show difference, i have used different names- Suchen and abc

Codepen- http://codepen.io/nagasai/pen/NrRoay

Upvotes: 1

Pankaj Parkar
Pankaj Parkar

Reputation: 136144

You could have something like below in which it will create a href with URL when cond is true, otherwise it will create a blank href which would not redirect to anywhere. 

ng-href="{{cond? '#/app/abc': ''}}"

Otherwise do remove href from anchor tag, and handle redirect logic from ng-click's doSomething function itself with the help of $location.path('#/app/abc') OR $state.go(depends on which router engine you are using) for redirection.

Upvotes: 3

Related Questions