CODEWITHSUNDEEP
javascriptangularjs
guitarfreak
guitarfreak

Reputation: 89

AngularJS - get the link in HTML

Good morning, this one is the only question that is similar in nature to mine, but unfortunately, it did not help me find an answer, so your help is highly appreciated.

I have the following snippet of HTML code:

<li class="first-page" ng-click="selectFirst()" onclick="window.scrollTo(0,0)">
    First
</li>

I want to adjust the <li> so that it shows a link. In the directive's link function I included one more function:

function getPaginationLink($location) {
        var linkToPage = $location.$$url;
        console.log($location.$$url);
        return linkToPage;
    }

and slightly changed the html, in the following way:

<li class="first-page" ng-click="selectFirst()" onclick="window.scrollTo(0,0)">
    <a ng-onload="getPaginationLink($location)" ng-href="{{ linkToPage }}">
        First
    </a>
</li>

Upvotes: 0

Views: 607

Answers (1)

Muhammad Usman
Muhammad Usman

Reputation: 10148

linkToPage is not linked with the model anywhere in your controller's getPaginationLink function and using it in href="{{linkToPage}}" would be undefined.

If you just want to use the returned in value of getPaginationLink in href, just use

<li class="first-page" ng-click="selectFirst()" onclick="window.scrollTo(0,0)">
<a ng-init="url = getPaginationLink($location)" ng-href="{{url}}">First</a>
</li>

Here is an example snippet

angular.module('app', []).controller('ctrl', function($scope){

$scope.getr = function(){
  return "URL"
}

})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.9/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<li class="first-page" ng-click="selectFirst()" onclick="window.scrollTo(0,0)">
<a ng-init="url = getr()" ng-href="{{url}}">First</a>
</li>
</div>

Upvotes: 1

Related Questions