How can I change the value of the href-Attribute based on the current path?

My if clause in AngularJS looks like this:

    if (newPath.indexOf('test') > -1) {
      // change the value of the href-Attribute
    } else {
      // don't change the value of the href-Attribute
    }

My HTML looks like this:

    <li>
      <a aria-expanded="false" role="button" href="/path1/path2/path4">Downloads</a>
    </li>

How can I change the value of the href-Attribute based on the current path?

My if clause in AngularJS looks like this:

    if (newPath.indexOf('test') > -1) {
      // change the value of the href-Attribute
    } else {
      // don't change the value of the href-Attribute
    }

My HTML looks like this:

    <li>
      <a aria-expanded="false" role="button" href="/path1/path2/path4">Downloads</a>
    </li>

• javascript
• angularjs
• twitter-bootstrap
• angularjs-scope
• angularjs-ng-href

Share Follow asked Mar 20, 2017 at 9:18 Codehan25Codehan25 3,0141212 gold badges5959 silver badges109109 bronze badges

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

you can use ng-href to dynamically assign value to href

<li>
  <a aria-expanded="false" role="button" ng-href="{{myVar}}">Downloads</a>
</li>

$scope.myVar ="/path1/path2/path4";

if (newPath.indexOf('test') > -1) {
      $scope.myVar = "/path1/path2/path4" // you can assign whatever path to this variable 
} else {
      $scope.myVar = "/path1/path2/path3" // you can assign whatever path to this variable
}

You can get current path with

var url = $location.absUrl().split('?')[0];

Replace href attribute

var myEl = angular.element( document.querySelector( '#selector' ) );
myEl.attr('href',url);

 if (newPath.indexOf('test') > -1) {
      $scope.newPath = newPath.test;
    } else {
      // don't change the value of the href-Attribute
    }

<li>
      <a aria-expanded="false" role="button" ng-href="{{newPath}}">Downloads</a>
    </li>