使用带有angular2的Filesaver js [英] Use Filesaver js with angular2

问题描述

我已经检查了所有的文章，我可以找到使用Filesaver JS有角度，但我仍然不能包围我的头围绕一个污点。
我将其添加到我的system.config.js的地图部分

i have checked all the post i can find on the use of Filesaver JS with angular, but i still could not wrap my head around a soution. I added this to the map section of my system.config.js

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

我将它添加到system.config.js的packages部分

I added this to the packages section of the system.config.js

  'filesaver': {defaultExtension: 'js'}

然后我以这种方式导入我的service.ts

I then imported it in my service.ts this way

import { saveAs } from 'filesaver';

但是我收到这个错误。

有人可以帮忙吗？

推荐答案

尝试以下

npm install file-saver --save

然后将一个声明文件添加到您的项目中，如declarations.d.ts，并在其中放入

Then add a declarations file to your project like 'declarations.d.ts' and in it put

declare module 'file-saver';

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

In your systemjs.config.js, add the following to the map section

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

然后导入您的组件或服务中的库，如下所示

And then import the library in your component or service like below

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')
  }
} 

希望有帮助。

这篇关于使用带有angular2的Filesaver js的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！