Angular Promise 在另一個組件中返回未定義

Question

這是我的carComponent.ts它有以下方法：

async Download() {
    try {
      const settings = {
        kit: true,
        tyres: true,
        serviced: false,
      };
      const [kits, tyres] = await Promise.all([
        this.checkKits(
          conf,
          "A",
         100,
          false,
          "My kit"
        ),
        this.checktyres(100, 50, false, 'My tyres'),
      ]);
    
    const checkSvg= [...kits.slice(0, 4), ...tyres, ...kits.slice(4)];
   checkSvg.forEach(({ side, svg }) => {
     console.log(svg); // here it returns all the SVG data; works 100%
   return svg;
    });
  }
  catch(e) {
    console.error(e);
  }
   
}

這是調用上述方法的viewCarsComponent.ts 。 但是這里的承諾返回未定義，所以任何人都可以幫助解決我的問題嗎？ 我不確定我做錯了什么或我需要在這里做什么來解決。

async DisplaySVG() {
 await this.carComponent.Download().then(data =>{
  console.log(data);
  // here it is undefined... 
 }).catch(error =>{
   console.log(error)
 });

  }

謝謝

Answer 1

您目前在 Download 中沒有 return 語句，因此默認情況下，promise 解析為未定義。 如果要返回所有套件和輪胎的數組，則只需返回checkSvg ：

const checkSvg = [...kits.slice(0, 4), ...tyres, ...kits.slice(4)];
return checkSvg;

如果它們中的每一個都有一個.svg屬性，而你只想要那些，那么創建一個只有.svg屬性的新數組，並返回：

const checkSvg = [...kits.slice(0, 4), ...tyres, ...kits.slice(4)];
const svgsOnly = checkSvg.map(({ svg }) => svg);
return svgsOnly;