Question

正在玩Angular 2，试图创建示例应用程序来展示自己，我已经完成了几乎所有的事情。最后，我正在尝试实施下载选项。为此，我挖了SO，我得到了this

根据该示例我尝试复制它，但后来知道 HTTP_PROVIDERS 已弃用。有人可以告诉我当前可用的等效模块是什么。并指导我开始。

请与任何工作的掠夺者分享以供参考

到目前为止，我已经

了

import { Http, ResponseContentType } from '@angular/http';
export class AboutComponent implements OnInit {

  //constructor() { }
  constructor(private dataService: dataService,private http: Http){}
  about=[];
  private filePath = './coreMachineDetails/machine109902.docx' // docx in my local folder      
   ngOnInit(){
    //some codes
  }

  getFile(){
    return this.http.get(this.filePath,{
      responseType: ResponseContentType.Blob,     
    }).map(res =>{
          return {
        filename: 'machine109902.docx',
        data: res.blob()
      };
    }).subscribe(res => {
        console.log('start download:',res);
        var url = window.URL.createObjectURL(res.data);
        var a = document.createElement('a');
        document.body.appendChild(a);
        a.setAttribute('style', 'display: none');
        a.href = url;
        a.download = res.filename;
        a.click();
        window.URL.revokeObjectURL(url);
        a.remove(); // remove the element
      }, error => {
        console.log('download error:', JSON.stringify(error));
      }, () => {
        console.log('Completed file download.')
      });
  }
}

在视图中

<button class="btn waves-effect waves-light btn-primary custom-btn" (click)="getFile()"><i class="fa fa-file-pdf-o"></i> Download manuals</button>

Answer 1

因为您正在引用本地文件。它已被框架阻止。查看更多 https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy

Angular 2 - 文件下载 - 没有任何后端帮助 - 可能吗？

1 个答案: