1

我有两个 HTML 按钮“上一个”和“下一个”。我使用这些按钮导航到不同的选项卡（组件）。该代码在 Chrome 和 Firefox 中按预期工作，但在 IE 或 Edge 中单击下一个和上一个按钮时会出现空白屏幕。

“下一步”按钮事件处理程序：

saveAndNextClick(form: FormGroup, section: string) {
  this.markFormGroupTouched(form);
  if (form) {
    if (section === 'lastsection') {
      this.sectionChangeService.change('schoolSection');
    } else {
      this.hideShowTabSection();
      this.selectedSectionGroup[section] = false;
    }
  }
  this.saveData(); 
  this.saveService.saveQuestion();
}

模板

<div class="d-flex app-question-navigation justify-content-between">
  <a class="btn btn-secondary buttonSize (click)="previousClick(appSectionThree,'sectionTwo')">
    Previous
  </a>
  <span class="app-question-pagination">Section 3 of 8</span>
  <a class="btn btn-secondary buttonSize" (click)="saveAndNextClick(appSectionThree,'sectionFour')">
    Next
  </a>
</div>
</form>

组件.ts

ngOnInit() {
  this.sectionChangeService.listen().subscribe((message: any) => {
    if (message.text === 'prvsparentdemosection') {
      this.saveAndNextClick(this.pdemographicsSectionFive, 'sectionFour');
    }
  });
}

Service:

```typescript
import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs';

@Injectable({ providedIn: 'root' })

export class SectionChangeService {
  private listner = new Subject<any>();

  change(message: string) {
    this.listner.next({ text: message });
  }

  clearListner() {
    this.listner.next();
  }

  listen(): Observable<any> {
    return this.listner.asObservable();
  }
}
4

1 回答 1

1

尝试使用 polyfill，它们对于 IE 和 Edge 是必需的，因为它们缺少一些 es6/7 功能

在 polyfills.ts 文件中导入它

import 'core-js/es7/array';
import 'core-js/es7/object';
import 'core-js/es6/reflect';
import 'core-js/es7/reflect';`
于 2020-03-18T00:29:31.047 回答