Header link not working (SOLVED)

Hello to all,

I add <a> link to my header but the icon has no link at all. Sorry newbie here and I can’t figure out why. Please advice, the following is my HTML code.

<ion-view>
    <ion-nav-bar>
        <ion-nav-back-button>
        </ion-nav-back-button>
    </ion-nav-bar>
    <ion-nav-view></ion-nav-view>
    <div class="bar bar-header bar-light">
        <h1 class="title">Sign Up</h1>
        <a href="#/signin" class="button button-icon icon ion-ios-locked-outline"></a>
    </div>
    <ion-content class="has-header">
        <div class="padding">
            <div class="list list-inset">
                <label class="item item-input">
                    <input type="text" placeholder="First Name">
                </label>
                <label class="item item-input">
                    <input type="text" placeholder="Last Name">
                </label>
                <label class="item item-input">
                    <input type="text" placeholder="Email">
                </label>
                <label class="item item-input">
                    <input type="password" placeholder="Password">
                </label>
                <label class="item item-input">
                    <input type="password" placeholder="Confirm Password">
                </label>
            </div>
            <div class="centercontent">
                <p>By tapping on "Sign Up" button, you agree to the Terms of Service and Privacy Polity.</p>
                <button class="button button-outline button-positive">
                    Sign Up
                </button>
            </div>

        </div>
    </ion-content>
</ion-view>

how did you solve this i’m facing the same problem