从服务返回的值未传输到组件

Question

我有一个 Angular 服务来解析 Excel 看起来像这样的文件：

import { Injectable } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import * as XLSX from 'xlsx';

type AOA = any[][]


@Injectable({
    providedIn:'root'
})
export class BomParseService {
    data: AOA = []

  constructor() 
  { 
  }


  parseExcel(excelFile)
  {
    /* wire up file reader */
    const target: DataTransfer = <DataTransfer>(excelFile.target);
    if (target.files.length !== 1) throw new Error('Cannot use multiple files');
    const reader: FileReader = new FileReader();
    reader.onload = (e: any) => 
    {
      /* read workbook */
      const bstr: string = e.target.result;
      const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });

      /* grab first sheet */
      const wsname: string = wb.SheetNames[0];
      const ws: XLSX.WorkSheet = wb.Sheets[wsname];

      /* save data */
      this.data = <AOA>(XLSX.utils.sheet_to_json(ws, { header: 1 }));
      console.log("BOM PARSE SERVICE LOG: " , this.data)
      return this.data
    };
    reader.readAsBinaryString(target.files[0]);

  }

如您所见，我正在尝试 return this.data 的值。但是，当我尝试在我的组件中访问此值时，我存储该值的变量是 returning undefined。

async ReadExcel(event)
  {
    return new Promise<Object>((resolve, reject) =>
    {
      let excelContents = this.parser.parseExcel(event)
      console.log(excelContents)
    }
  )}

解析器是指服务的私有 class。控制台日志记录 excelContents 在控制台中产生未定义，尽管我认为它现在应该采用服务功能的 return 值。我在这里遗漏了什么明显的东西吗？

Answer 1

是的，你是。您需要调用 resolve 来设置您的承诺返回的值：

parseExcel(excelFile): Promise<any>
  {
    /* wire up file reader */
    const target: DataTransfer = <DataTransfer>(excelFile.target);
    if (target.files.length !== 1) throw new Error('Cannot use multiple files');
    const reader: FileReader = new FileReader();
    return new Promise((resolve, reject) => {
        reader.onload = (e: any) => 
        {
          /* read workbook */
          const bstr: string = e.target.result;
          const wb: XLSX.WorkBook = XLSX.read(bstr, { type: 'binary' });

          /* grab first sheet */
          const wsname: string = wb.SheetNames[0];
          const ws: XLSX.WorkSheet = wb.Sheets[wsname];

          /* save data */
          this.data = <AOA>(XLSX.utils.sheet_to_json(ws, { header: 1 }));
          console.log("BOM PARSE SERVICE LOG: " , this.data)
          resolve(this.data);
        };
        reader.readAsBinaryString(target.files[0]);

  }

那么您的异步函数将如下所示：

async ReadExcel(event)
  {
    return  this.parser.parseExcel(event)
  }

更多信息：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise

从服务返回的值未传输到组件

Value returned from service not being transferred to component

typescript

js-xlsx

angular