javascript - 获取对象数组然后将其显示在我的组件中

Question

我尝试显示对象数组。

这就是我进入组件的方式

getFiles(){
    this.fileService.getFileList().subscribe(res => {
      this.files = res;
      console.log(this.files);
    })
}

为我服务

getFileList() {
 return this.http.get(`http://localhost:4001/files`)
}

this.files 的输出是:

> {secret: Array(2)} secret: Array(2) 0: files: (2) ["file1.pdf",
> "file2.pdf"]
> __proto__: Object 1: {pass: "88VpGQAtNB"} length: 2
> __proto__: Array(0)
> __proto__: Object

JSON.stringify 给了我输出

stringify gave me {"secret":[{"files":["46544556_2.pdf","org_46544556_2.pdf"]},{"pass":"hoc1WpNj63"}]}

如何迭代这个对象数组？

<li *ngFor="let file of files" >
{{file}}
</li

这给了我错误:

ERROR Error: Cannot find a differ supporting object '[object Object]' of type 'object'. NgFor only supports binding to Iterables such as Arrays.

这是我的后端

app.get('/files', function (req, res) {
  let folder = app.get('filePath');
  const filesInDir = fs.readdirSync(folder, {
      withFileTypes: true
    })
    .filter(item => !item.isDirectory())
    .map(item => item.name)
  res.send({
    secret: [{ files: filesInDir }, { pass: password }],
  })

  return console.log('files from tmp dir: ' + filesInDir)
});

Answer 1

 getFiles(){
    this.fileService.getFileList().subscribe(res => {
      this.files = res.files; // get files from res
      console.log(this.files);
    })
    }

您需要更改组件中的方法。