angular - 将 Filesaver js 与 angular2 一起使用

Question

我已经检查了所有我能找到的关于使用带 Angular Filesaver JS 的帖子，但我仍然无法解决问题。 我将其添加到我的 system.config.js 的 map 部分

 'filesaver': 'node_modules/filesaver/src/Filesaver.js'

我将其添加到 system.config.js 的包部分

  'filesaver': {defaultExtension: 'js'}

然后我以这种方式将其导入到我的 service.ts 中

import { saveAs } from 'filesaver';

但是我得到了这个错误。

有人可以帮忙吗？

Answer 1

尝试以下操作

npm install file-saver --save

然后向您的项目添加一个声明文件，例如“declarations.d.ts”，并在其中放置

declare module 'file-saver';

在您的 systemjs.config.js 中，将以下内容添加到 map 部分

'file-saver': 'npm:file-saver/FileSaver.js'

然后像下面这样在你的组件或服务中导入库

import { Component } from '@angular/core';
import * as saveAs from 'file-saver';


@Component({
  selector: 'my-app',
  template: `<h1>Hello {{name}}</h1>
  <button (click)="SaveDemo()">Save File</button>`,
})
export class AppComponent {
  name = 'Angular';

  SaveDemo() {
    let file = new Blob(['hello world'], { type: 'text/csv;charset=utf-8' });
    saveAs(file, 'helloworld.csv')
  }
} 

希望对您有所帮助。