时间戳

首页 > 解决方案 > Angular 应用程序将 Array 检测为 Object 并返回错误

angular - Angular 应用程序将 Array 检测为 Object 并返回错误

问题描述

在我的应用程序中，我将文件存储在数据库中，存储文件后，我将表中创建的行的 ID 返回到我的 Angular 应用程序，以将其添加到用户信息中。

当我得到 id 时，它们作为 Array 返回，但是我不知道为什么，Angular 向我显示了一个 Object 元素的错误。

这是我的 API 上用于存储文件并返回 ID 的函数

function uploadFiles(req, res, next) {
  let queries = []
  for (var i = 0; i < req.files.length; i++) {
    queries.push(db.any('insert into public.documents(original_name,mimetype,path) values(' + "'" + 
    req.files[i].originalname + "','" + req.files[i].mimetype + "','" + req.files[i].path + 
    "') returning id_document,original_name"))
  }
  Promise.all(queries).then((data)=>{
    res.json(data);
  },(err)=>{
    console.log('uploadFiles error : ',err)
  })
}

这是我将文件发送到 API 的方法，然后是我如何获取 id 以将它们添加到我的用户信息中

for (var i = 0; i < this.selectedFiles.length; ++i) {
  let files = this.selectedFiles[i].files
  await this.patientService.uploadFiles(files).then((data)=> {
    console.log(data)
    let result = []
    for (var j = 0; j < data.length; ++j) {
      result.push({'id':data[j][0].id_document,'name':data[j][0].original_name})
    }
    // add result to user information
  })
}

和uploadFiles功能

async uploadFiles(files){
  let formData = new FormData()
  for (var i = 0; i < files.length; ++i) {
    formData.append('files',files[i])
  }
  return await this.httpClient.post(LOCATION_API + 'upload-file', formData).toPromise()
}

所以这里console.log(data)给我看这个

在此处输入图像描述

正如我们所看到的，它是一个数组，但这是我得到的错误

在此处输入图像描述

最后，奇怪的是显示了错误，但应用程序仍然有效。但是如果它有效，我不希望错误留在我的应用程序上......

标签： angular

解决方案

问题是您没有传递有关 API 返回的类型的任何信息，因此this.httpClient.post使用默认值，它是object. 您可以在文档中找到它。

要解决此问题，您需要将预期的返回类型显式定义为以下的通用参数httpClient.post：

interface FileData {
  id_document: string;
  original_name: string;
}

this.httpClient.post<Array<Array<FileData>>(/* ... */);
                    ^---------Here--------^

另请注意，await在从 async 函数返回的承诺之前以及.then使用时不需要

推荐阅读