如何在 Angular 中使用多个 ViewChild 元素 (2/4)

Posted 2023-03-13

【中文标题】如何在 Angular 中使用多个 ViewChild 元素 (2/4)

【英文标题】：How to use multiple ViewChild element in Angular (2/4)

【发布时间】：2018-02-21 17:13:19

【问题描述】：

我已关注https://devblog.dymel.pl/2016/09/02/upload-file-image-angular2-aspnetcore/ 上传单个文件并且工作正常。

现在我想根据数组documentTypes[] 中的元素数量上传动态文件数量。

我的 html：

<div *ngFor="let item of documentTypes ;let i=index">
  <input #fileInput[i] type="file" #select name="document[i]" />
</div>

我的 TS：

@ViewChild("fileInput") fileInput: any[];

提交函数：

onSubmit = function (docs) 
  for (var i = 0; i < this.documentTypes.length; i++) 
    let fi = this.fileInput[i].nativeElement;
    //This  is not working. Here fileInput is undefined
  
;

任何建议将不胜感激。

【参考方案1】：

@ViewChild 装饰器仅适用于一个孩子。要获取孩子的数组，您需要使用@ViewChildren

【讨论】：

尝试帮助他人。这就是***的想法。你需要分享你的知识。