0

如果我不下载 excel 文件，我的路由工作，但如果我下载文件然后使用路由，那么它会失败。

似乎有问题的线是这条线：

 **const Excel = require('exceljs');**

此行在下载 excel 的函数内部。如果我点击后退按钮，当前页面和上一页都显示在新页面上，并且不会点击 OnInit 和构造函数

<a  (click)="btnClick()" class="btn btn-default cancel-btn">Back</a>

btnClick() {
    this.router.navigateByUrl('/newPage');
};

这个我也试过了

<a  [routerLink]="['/newPage']" class="btn btn-default cancel-btn">Back</a>

但是在新页面上，我可以看到两个页面的选择器，

 <oldPage></oldPage>
 <newPage></newPage>

然后我尝试了这个：

 I have tried ng Zone code too.

  btnClick() {
    if (this.inTheZone){
       this.inTheZone = false;
       this.ngZone.run(() => {
      this.router.navigate(['/newPage']);
    })
  }
};

我的路由代码是这样的：

const routes: Routes = [
{
  path: 'newPage', component: newPageComponent, data: { title: 'NewPage' }
}]

请任何人帮助。

4

1 回答 1

1

正如Fmerco所说，您的问题可能是您正在使用require，这会让您的应用程序崩溃。

在 Angular 中，我们使用 TypeScript，因此我们至少可以使用 ES2015。

这意味着我们使用 ES2015 中的模块系统，它import用作关键字来从模块中检索信息。

import { Workbook } from 'exceljs';

而且，如果您想将文件推送到客户端，则不能使用重定向（因为那样会破坏 SPA 概念，并且可能会破坏路由），因此您可能需要像file-saver.

workbook.xlsx.writeBuffer().then((data) => {
      let blob = new Blob([data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
      fs.saveAs(blob, 'CarData.xlsx');
});

您可以在https://www.ngdevelop.tech/export-to-excel-in-angular-6/中找到一个非常好的教程，在https://github.com/exceljs/exceljs中找到一个示例（已更新为 Angular 8）。

于 2020-02-24T11:51:07.057 回答