我正在进行一个Angular项目，在该项目中，用户可以一次上传多个问题，添加问题后，列表以单独的模式显示，用户可以为每个问题添加图表或图形。
因此，添加问题后，列表将在question.component.html文件中的for循环的帮助下显示。[question-s2.component.html是表示每个问题的组件。]
在显示列表的下一个模式中；添加图表"；选项，单击时会触发文件类型输入事件以上载图像。并且一旦图像被选择，它就应该调用函数"；addDiagEvent"；(在问题-s2.component.ts中(
现在，这里的问题是，当我只用一个问题(即，在question.component.html文件中没有引入循环(尝试这个问题时；addDiagEvent"；funtion调用正确，其余功能运行良好。
但在多个问题的情况下；addDiagramEvent"；函数未被调用。我想为每个问题单独添加图表(图像(。
question.component.html文件内部：这里，"；uploadedSnipps"；是一个数组，包含所有问题，并且"；questionUploaded"；是questions-s2.com.ponent的一个属性，用于显示列表中的每个问题。
<div class="questionModal-body">
<app-question-s2
*ngFor="let question of uploadedSnips; let i = index"
[questionUploaded]="question"
[index]="i"
>
</app-question-s2>
</div>
在question-s2.component.html文件中，我有这个标签"添加图表"；为了上传图像；addDiagEvent(("有问题的-s2.component.ts文件。
<label mat-stroked-button for="uploadInput" class="outlineStyle-btn-diag">
+ ADD DIAGRAM
</label>
<input id="uploadInput" type="file" style="display: none" (change)="addDiagEvent($event)"/>
<!-- diagram editor -->
<ngx-photo-editor
[imageChanedEvent]="DiagAddEvent"
(imageCropped)="croppedDiagMulti($event)"
>
</ngx-photo-editor>
<img [src]="base64" alt="" />
内部问题-s2.component.ts文件：
// -------- ADD Diagram Events ---------------
addDiagEvent(event: any): void {
this.DiagAddEvent = event;
console.log("Trigger editor");
}
// ------ After the photo has been cropped -------
croppedDiagMulti(event: CroppedEvent): void {
console.log("AfterCropped Func");
this.diagMulti64 = event.file;
const readerDiag = new FileReader();
readerDiag.readAsDataURL(this.diagMulti64);
readerDiag.onload = () => {
this.diagMulti =
typeof readerDiag.result === 'string' ? readerDiag.result : '';
this.diagMulti64Url = this.diagMulti;
};
}
查看UI以更好地理解：
编辑此外，是否有方法根据typeScript中的索引使用动态变量名？我想改变"；diagMulti"；我的问题-s2.component.ts文件中的变量转换为如下内容：第0个索引的diagMulti-0diagMulti-1用于第一个索引像那样的东西？
一个可能的原因可能是在多问题的情况下，输入标签的id是静态的，因为该标签标签无法对预期的输入标签应用操作。
也许你可以试试这个。
<label mat-stroked-button [attr.for]="'uploadInput-'+index" class="outlineStyle-btn-diag">
+ ADD DIAGRAM</label>
<input [id]="'uploadInput-'+index" type="file" style="display: none" (change)="addDiagEvent($event)"/>