如何以角度 11 导入 CSV 文件并将数据存储在数据库中，即 ASP.NET MVC？答案

【问题标题】：How to import CSV file in angular 11 and stored data in Database i.e ASP.NET MVC?如何以角度 11 导入 CSV 文件并将数据存储在数据库中，即 ASP.NET MVC？
【发布时间】：2021-04-18 08:10:03
【问题描述】：

<div class="container col-md-4 px-3">
    <input type="file" class="form-control-file" id="inputBulkTUpload">
    <br><br>
    <button type="submit" class="btn btn-info shadow" (click)="onAddBulkdata()">submit</button>
    <br><br>                 
</div>

当我点击“提交”按钮时，我想将数据存储在我的表中。

【问题讨论】：

ASP.NET MVC 是一个 Web 框架 - 不是数据库.....您需要提供更多信息以供任何人帮助您....
@marc_s 是的，感谢它的网络框架

标签： angular asp.net-mvc

【解决方案1】：

<div>
   <span class="drag-box-highlight" [ngClass]="CSVfile !== '' ? 'file-align' : 'file-none'">
   {{CSVfile}} <i class="material-icons">done</i>
   </span>
   <input type="file" id="uploadFiles" #uploadFiles (change)="uploadFile($event)" />
   <button mat-raised-button type="button" color="primary" [ngClass]="{'component-disabled' : CSVfile === ''}"
   (click)="importProvidersDetails()" [mat-dialog-close]="true" cdkFocusInitial>{{'BUTTON_IMPORT' | translate: lang}}</button>
</div>


  public uploadableFile: any = '';
  public CSVfile: any = '';
  filePath: string;
  fileName: any;
  uploadStatus = true;
  dataSource;
  isChecked = false;


validateFile(file: any) {
    if (!file || !file.name) {
      return false;
    }
    let filename = file.name;
    filename = filename.split('.');
    const filetype = filename.pop();
    if (filetype.toLowerCase() === 'csv') {
      return true;
    } else {
      return false;
    }
  }

  uploadFile(e: any) {
    if (e && e.target && e.target.files && e.target.files.length) {
      const fileName = e.target.files[0].name.split('.');
      if (fileName && fileName[1].toLowerCase() !== 'csv') {
        this.notify.error(this.translation.translate('ERROR_CHOOSE_CSV'));
      } else {
        if (this.validateFile(e.target.files[0])) {
          this.uploadableFile = e.target.files[0];
          this.CSVfile = e.target.files[0].name;
          this.uploadFiles.nativeElement.value = '';
          return;
        }
      }
    }
    this.CSVfile = '';
  }

  importProvidersDetails() {
    console.log(this.data.providerId)
    const file = new FormData();
    file.append('file', this.uploadableFile);

    this.shippingService.importProvidersDetails(this.data.providerId, file).subscribe((response: any) => {
      this.notify.success('Provider Details imported successfully');
      this.uploadStatus = true;
      this.dataSource = '';
      this.CSVfile = '';
      this.isChecked = false;
      this.uploadableFile = '';
      
    }, (error: any) => {
      console.log(error)
    });
  }

【讨论】：