Javascript 父组件中的多个子组件具有相同的实例2

我有一个子组件

文件上传

，我在父组件中多次使用它，如下所示

<form>
<fieldset>
    <legend>Input Files</legend>

    <file-upload id="s" imgpath="Image/saham.png" title="saham"></file-upload>
    <file-upload id="q" imgpath="Image/sandoq.png" title="sandoq"></file-upload>
    <file-upload id="o" imgpath="Image/oraq.png" title="oraq"></file-upload>

    <button type="submit" class="btn btn-success" (click)="save()" [disabled]="!cansave">Save</button>
</fieldset>

---

您有一个单例文件服务，这就是为什么它们都有该服务的相同实例。我假设您在AppModule中注入您的提供者，所以请删除它并尝试像这样在组件级别注入您的服务

@Component){
  providers: [FileService]
  ...
}
export class FileUploadComponent

有关多个服务实例的更多信息，请参见此。

---

希望这有帮助

您应该与Plunkr分享一个例子。没有足够的代码来找出问题所在。

文件上传

组件是否共享服务或其他内容？能否在.ts文件中共享代码？@Parid0kht能否从

输入

标记中删除

id

，并通过在

输入

标记中设置局部变量来尝试访问

输入

（像这样）@TalentedDrew是的，我尝试了动态

id

，我成功了。只有

FileService

的

url

字段被使用-你真的认为这就是问题所在吗？@rinukkusu如果你只使用FileService的url字段并不重要，如果它是一个单例，你的子组件将共享这个实例。你试过m吗你的答案是什么？：）我试过这个答案……但不是因为这个……我发现了问题，但我不知道如何解决它。它是在文件上传器的html中，这是由于

输入的缘故。。我已经更新了我的问题以显示确切的问题@brijmcq@Parid0kht如果您能共享组件代码，那就太好了
@Component){
  providers: [FileService]
  ...
}
export class FileUploadComponent