Angular5 Internet Explorer 및 firefox의 Routerlink 및 버튼에 대한 응답 없음

Question

새로운 Angular 5 CLI 응용 프로그램이 있으며 응용 프로그램의 상단 섹션에 대한 navmenu 구성 요소가 내장되어 있습니다. Edge 및 Chrome에서 내 메뉴 항목을 클릭하면 app.module.ts에 정의 된대로 내 경로가 완벽하게 작동합니다. 그러나 IE11이나 Firefox에서 링크를 클릭하면 아무 일도 일어나지 않습니다. 내가 가서 polyfills.ts에 나열된 볼 수있는 모든 polyfills를 사용할 수 있지만 변경 사항은 없지만 IE11에서 머티리얼 아이콘 렌더링과 관련된 문제를 수정했습니다.

<span *ngIf="isLoggedIn() == false"> 
     <button [routerLinkActive]="['link-active']" mat-icon-button > 
     <a [routerLink]="['/login']"> 
      <mat-icon>account_circle</mat-icon> Login 
     </a> 

     </button> 
    <span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span> 
    </span> 

내가 버튼 노드 밖으로

 <a [routerLink]="['/login']"> 
      <mat-icon>account_circle</mat-icon> Login 
     </a> 

참여하면 내가 너무 내 경로가 괜찮습니다, IE11 및 Firefox에서 올바르게과 경로를 클릭 할 수 있습니다. 어떻게 든 anchor를 활성화하는 것은 IE11과 Firefox에서 작동하지 않습니다. 누구든지 이것이 무엇 일 수 있는지 생각하고 있습니까? Edge와 Chrome은 완벽하게 작동합니다.

Answer 1

이에 대한 대답은 실제로 매우 간단합니다.

< 버튼 > 태그 실제로 필요하지 않으며 매트 아이콘 버튼 스타일은 <에 > 태그 원하는 결과를 달성

<a [routerLink]="['/login']" [routerLinkActive]="['link-active']" mat-icon-button> 
     <mat-icon>account_circle</mat-icon> Login 
    </a> 

을 적용 할 수있다. 내가 발견 한 것은 단추가 IE와 Firefox에서 앵커를 왜곡하고 있다는 것이 었습니다. 내가 버튼을 테스트

onclick="this.children[0].children[0].click()" 

를 넣을 때 경로는 메시지가 두 브라우저에서 앵커에 불구하고 점점되지 않았 음 대답를 알려준 파이어 폭스와 IE에서 일했다.