Angular - how to go from one page to another and scroll to the anchor in ion mode without using an identifier

Question

I am developing an ionic application. Who has a list of articles on my home page, and each article has a comment icon, which should serve as a link to the comment section on the article page.

How can I link from this main page to go to the link in the comments section of the article page?

Update

Since Angular uses the "URL" after #, it will not work to reference the id binding, as suggested in the answer, so I'm looking for another way to do this. I tried several solutions, but none of the following helped.

Here sometimes I get the correct value for the top bias, but when I go to another page of the article, the value remains unchanged.

This is the code I made:

List of Articles View:

<a ng-click="commentLink({{article.id}})"> <img class="social-images" src="icons/comment.svg"/> {{ article.comments.length }} </a> 

View article:

 <a name="comments-section"></a> 

Controller:

 $scope.commentLink = function(articleId) { return $state.go('main.article', {id: articleId}).then(function(state) { var position = $ionicPosition.offset(angular.element(document.getElementsByName('comments-section'))); console.log(position.top); $ionicScrollDelegate.scrollTo(position.left, position.top); }) }; 

I also tried this based on this article , but still no luck:

Controller:

 $location.hash('comments-section'); var handle = $ionicScrollDelegate.$getByHandle('articleDelegate'); handle.anchorScroll(true); 

View:

 <ion-content delegate-handle="articleDelegate"> <a id="comments-section"></a> 

Answer 1

If there is an identifier in the comments section (for example, id = "new-comment"), then from the first page you can try:

 <a ng-click="goToComment()">...</a> 

And in the controller:

 $scope.goToComment = function() { return $state.go('whatever the comment state is', {param:param}).then(function(state) { $location.hash('new-comment'); $ionicScrollDelegate.anchorScroll(true) }) }