Избегайте флажков, если нажата метка

Question

У меня есть флажок и метка, как это.Проблема в том, что я не могу нажать href, поскольку весь раздел работает как единое целое.т.е. когда я щелкнул ярлык, он запускает флажок.Так как я могу отделить или избежать этого поведения?т.е. мне нужно нажать гиперссылку.

  <ion-item>
    <ion-label class="long-text">I accept the Terms & Conditions and the Privacy Policy found
      <a href="#" (click)="goToPrivacyPolicy()">here</a></ion-label>
    <ion-checkbox [(ngModel)]="terms" slot="start"></ion-checkbox>
  </ion-item>

UI

Попробовал это:Но пока нет Удачи?

.ts

  goToPrivacyPolicy(event) {
    event.stopPropagation(); //or event.preventDefault()
    this.iab.create(environment.privacyPolicy);
  }

html

<ion-item>
    <ion-label class="long-text">I accept the Terms & Conditions and the Privacy Policy found
      <a href="#" (click)="goToPrivacyPolicy($event)">here</a></ion-label>
    <ion-checkbox [(ngModel)]="terms" slot="start"></ion-checkbox>
  </ion-item>

Answer 1

ПРОВЕРКА РАБОЧИЙ СТЕКБЛИЦ

<ion-item text-wrap>
 <ion-row>
    <ion-col col-2 no-padding no-margin>
      <ion-item no-padding no-margin no-lines>
        <ion-checkbox [(ngModel)]="agreed"></ion-checkbox>
      </ion-item>
    </ion-col>
    <ion-col col-10 no-padding no-margin>
      <ion-item no-padding no-margin no-lines>
        Agree to <a target="_blank" href="http://www.terms-of-service.com">Terms of Service</a> and <a target="_blank" href="http://www.privacy-policy.com">Privacy Policy</a>. found  <a href="#" (click)="goToPrivacyPolicy($event)">here</a>
      </ion-item>
    </ion-col>
  </ion-row>
</ion-item>