ng-href does not work in a button. angularjs 1.7

Question

<button ng-href="#!/edit/{{a.id}}" 
        type="button" 
        class="btn btn-default btn-sm">
    <span class="glyphicon glyphicon-edit"></span> 
    Edit
</button>

Nothing happens when I click on the button. But It goes to the link I want if I use

<a ng-href="#!/edit/{{a.id}}> Edit </a>

How can I use a button for this routing? Thanks

It's not the default behaviour of a button to navigate to its `href` attribute on click, you have to implement it yourself. See [this post](https://stackoverflow.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link) for examples on how to do it — Kaddath, Feb 25 '19 at 09:57

score 1 · Accepted Answer · answered Feb 25 '19 at 09:57

The issue is that <button> elements don't support the href attribute.

What you can try instead is to style your <a> element to look like a button using Bootstrap's classes.

<a ng-href="#!/edit/{{a.id}}"
   class="btn btn-default btn-sm">
    <span class="glyphicon glyphicon-edit"></span>
    Edit
</a>

ng-href does not work in a button. angularjs 1.7

1 Answers1