Question

嗨，我需要根据用户在javascript或angular中的选择，从数组中删除多个文件......... 我已经尝试过以下代码

首先，我们有一个文件，该文件上传到数组中并显示在复选框中，如下代码所示

   <div *ngFor="let image of uploadedImages" style="margin-left:10%"  >
          <label class="container" style="font-size:14px">
            {{image.name}}&nbsp;&nbsp;ModifiedDate:&nbsp;&nbsp;{{image.lastModifiedDate}}
            <input type="checkbox" style="float:left" value="{{image.name}}" id="lifecheck"
                   [name]="image.name">&nbsp;&nbsp;
            <span class="checkmark"></span> <br><br>
          </label>
        </div>
        <div style="padding-left:34px;padding-bottom:3px;">
          <button *ngIf="imagefilename.length" class="btn btn-danger" style="width:200px;padding-left:30px" (click)="dropzone.reset();resetimage(image.Checked)">
            Reset Selected files
          </button>
        </div>

用户将单击要删除的复选框，然后单击显示的按钮和

它调用如下所示的函数

resetimage(imageName:any) {
 for(var index = 0; index<this.uploadedImages.length;index++){
 if(document.getElementByName("lifecheck")[i].checked==true){
 this.uploadedImages.splice(index,1);
}
}
}

因此，在此功能中，仅当用户选择了多个要删除的文件时，才删除数组中的第一个文件

因此，如果有任何解决方案，请帮助我

预期结果：根据用户在javascript或angular中的选择，从数组中删除多个上传的文件

实际结果：遇到错误

Answer 1

在打字稿document.getElementByName("lifecheck")中找不到dom中的元素，因此出现错误。在您的dom中，您正在创建id ='lifecheck'的动态输入元素。这是分配ID的错误方法，因为dom ID必须是唯一的。

因此，要解决此问题，您可以更改视图以为输入元素分配动态唯一ID：

   <div *ngFor="let image of uploadedImages;let i=index" style="margin-left:10%"  >
          <label class="container" style="font-size:14px">
            {{image.name}}&nbsp;&nbsp;ModifiedDate:&nbsp;&nbsp;{{image.lastModifiedDate}}
            <input type="checkbox" style="float:left" value="{{image.name}}" id="lifecheck_{{i}}"
                   [name]="image.name">&nbsp;&nbsp;
            <span class="checkmark"></span> <br><br>
          </label>
        </div>
        <div style="padding-left:34px;padding-bottom:3px;">
          <button *ngIf="imagefilename.length" class="btn btn-danger" style="width:200px;padding-left:30px" (click)="dropzone.reset();resetimage(image.Checked,i)">
            Reset Selected files
          </button>

因此，您要创建id =“ lifecheck_1”等的输入元素。然后可以将此id传递给您的打字稿功能并找到该元素：

resetimage(imageName:any,id:number) {
 for(var index = 0; index<this.uploadedImages.length;index++){
 if(document.getElementById("lifecheck_" + id).checked==true){
 this.uploadedImages.splice(index,1);
}
}
}

注意：这应该是解决错误的方法；

如何解决错误TypeError：无法读取未定义此错误的属性“已检查”

1 个答案: