使用数据切换时，使用角度材质的Angular 8应用程序在Internet Explorer上不工作="；标签"；使用href调用

我正在使用Angular 8和Angular材质，我在IE edge或以前的版本上遇到了一个问题（它在chrome上运行良好）

问题是：

错误：未捕获（承诺中）：错误：无法匹配任何路由。URL段：“内容-2”
错误：无法匹配任何路由。URL段：“内容-2”

HTML:

当我使用

cosole.log（）

检查类型时，当我单击模块2按钮时，我可以看到我的ct-1、ct-2、ct-3同时执行。出于这个原因，我认为问题与角度材质有关，因为内容已加载，但是，选项卡操作不起作用，我收到错误消息

我正在使用polyfills

导入

和

，但它没有解决问题

<div class="card">
    <div id="submenu" class="card-header card-header-tabs card-header-primary">
        <div class="nav-tabs-navigation">
            <div class="nav-tabs-wrapper">
                <span class="nav-tabs-title"></span>
                <ul class="nav nav-tabs" data-tabs="tabs">
                    <li class="nav-item">
                        <a mat-button class="nav-link active" href="#content-1" data-toggle="tab">
                            <i class="material-icons"></i> Content 1
                            <div class="ripple-container"></div>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a mat-button class="nav-link" href="#content-2" data-toggle="tab">
                            <i class="material-icons"></i> Content 2
                            <div class="ripple-container"></div>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a mat-button class="nav-link" href="#content-3" data-toggle="tab">
                            <i class="material-icons"></i> Content 3
                            <div class="ripple-container"></div>
                        </a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="card-body">
        <div class="tab-content">
            <div class="tab-pane active" id="content-1">
                <app-list type="ct-1"></app-list>
            </div>
            <div class="tab-pane" id="content-2">
                <app-list type="ct-2"></app-list>
            </div>
            <div class="tab-pane" id="content-3">
                <app-list type="ct-3"></app-list>
            </div>
        </div>
    </div>
</div>

import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { MyService } from '../../MyService.service';
import { MatDialog } from '@angular/material';
import { DialogComponent } from '../dialog/dialog.component';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { Location } from '@angular/common';

@Component({
  selector: 'app-list',
  templateUrl: './list.component.html',
  styleUrls: ['./list.component.scss']
})

export class ListComponent implements OnInit {
  activeModule;
  activeSection;
  dataSource;
  totalRecords: number;
  columnsToDisplay: string[];

  @Input()
  type: string;

  @ViewChild(MatSort, { static: true }) sort: MatSort;

  constructor(private myService: MyService, public dialog: MatDialog, private location: Location) {

    this.activeModule = this.location.path().split('/')[1];
    this.activeSection = this.location.path().split('/')[2];

    switch (this.activeModule) {
      case 'module1':
        this.columnsToDisplay = ['column 1', 'column 2', 'column 3', 'column 4', 'column 5'];
        break;
      case 'module2':
      case 'module3':
        this.columnsToDisplay = ['column 1', 'column 2', 'column 3', 'column 4'];
        break;
    }
  }

  openDialog(id, indexRow: number): void {
    this.myService.getById(id).subscribe(data => {
      const dialogRef = this.dialog.open(DialogComponent, {
        width: '650px',
        data: data
      });

      dialogRef.afterClosed().subscribe(result => {
        if (result) {
          this.removeAt(indexRow);
        }
      });
    });
  }

  ngOnInit() {
    let serviceCall;

    // console.log(this.type);
    switch (this.type) {
      case 'ct-1':
        serviceCall = 'getContent1';
        break;
      case 'ct-2':
        serviceCall = 'getContent2';
        break;
      case 'ct-3':
        serviceCall = 'getContent3';
        break;
    }

    this.myService[serviceCall]().subscribe((data) => {
      const res = data.length > 150 ? data.slice(0, 150) : data;

      this.totalRecords = data.length;
      this.dataSource = new MatTableDataSource(res);
      this.dataSource.sort = this.sort;
    });
  }

  removeAt(index: number) {
    const data = this.dataSource.data;
    data.splice(index, 1);

    this.dataSource.data = data;
  }
}