无法解析 Angular2Csv 的所有参数：(?, ?, ?)答案

【问题标题】：Can't resolve all parameters for Angular2Csv: (?, ?, ?)无法解析 Angular2Csv 的所有参数：(?, ?, ?)
【发布时间】：2019-02-19 14:28:07
【问题描述】：

我已按照链接https://www.npmjs.com/package/angular2-csv 中给出的步骤在 ASP.Net Core 的 Angular 4 应用程序中导出到 csv 文件，但出现错误“无法解析 Angular2Csv 的所有参数：(?, ?, ?) 。”

请在下面找到我已经完成的步骤，

已经使用 npm 安装了 angular2-csv
```
 npm install --save angular2-csv@0.2.5
```
然后我已经在 app.module.server.ts 中导入了
```
import { Angular2Csv } from 'angular2-csv';
```

并添加了提供者，

@NgModule({
declaration:[...],
imports:[...],
providers:[Angular2Csv]
})

然后我创建了用于导出到 csv 的选项和数据

import { Angular2Csv } from 'angular2-csv';

@Component({
    selector: 'home',
    templateUrl: './my.component.html',
    styleUrls: ['./my.component.css'],
    encapsulation: ViewEncapsulation.None
})
export class MyComponent { 
options = {
    fieldSeparator: ',',
    quoteStrings: '"',
    decimalseparator: '.',
    showLabels: false,
    headers: [],
    showTitle: true,
    title: 'asfasf',
    useBom: false,
    removeNewLines: true,
    keys: ['approved','age','name' ]
  };
  data = [
    {
      name: "Test, 1",
      age: 13,
      average: 8.2,
      approved: true,
      description: "using 'Content here, content here' "
    },
    {
      name: 'Test 2',
      age: 11,
      average: 8.2,
      approved: true,
      description: "using 'Content here, content here' "
    },
    {
      name: 'Test 3',
      age: 10,
      average: 8.2,
      approved: true,
      description: "using 'Content here, content here' "
    }
  ];
  }

我的模板看起来像这样

<angular2csv [data]="data" filename="test.csv" [options]="options"></angular2csv>

当我构建和运行解决方案时，出现下面提到的错误

“无法解析 Angular2Csv 的所有参数：(?, ?, ?)”

请帮我解决这个问题

【问题讨论】：

标签： angular asp.net-core-mvc asp.net-core-2.0

【解决方案1】：

这对我有用：

   downloadFile() {
   new Angular2Csv(this.data, 'test' , this.options) ;
    }

并在您的 html 中单击按钮时调用它

<a (click)="downloadFile()">Download file</a>

这是我在选项中添加的内容

this.options = {
      fieldSeparator: ';',
      quoteStrings: '"',
      decimalseparator: '.',
      showLabels: true,
      headers: ['name','age','average', 'approved','description'],
      useBom: false,
    };

【讨论】：

【解决方案2】：

从docs，你应该只导入Angular2CsvModule

import { Angular2CsvModule } from 'angular2-csv';

imports: [
  Angular2CsvModule,
  ........
],

并且无需在您的 providers 数组中提供 Angular2Csv。删除那个

【讨论】：

否我已尝试导入但无法导入 Angular2CsvModule。我的应用程序是 angular 4。如果 angular 2,4 或 5 必须使用 0.2.5 版本并因此在提供程序中使用，文档中有注释。

【解决方案3】：

以下对我有用

包.json

"angular2-csv": "~0.2.5",

在需要它的组件中，添加如下

  import { Angular2Csv } from 'angular2-csv';

new Angular2Csv(...) 应该可以工作

我们希望团队保留此功能，而无需在 html 中添加组件

【讨论】：