angular中文件上传bug,动态菜单设置

迷南。 2021-11-23 11:32 261阅读 0赞

#### 文件上传 ####

在使用input type="file"的时候，上传图片的时候，删除之后第一次再不能上传相同的图片bug。

1.  首先删除之后将input的类型设置的text
    
        // 删除图片
        deleteImg(index: any) {
            this.formData.fileList.splice(index, 1);
            this.fileUploadImg.nativeElement.setAttribute('type', 'text');
        }
2.  然后点击上传的时候设置为file
    
        // 添加设备基础文件选择上传文件
        handleFileUpload() {
           this.fileUploadImg.nativeElement.setAttribute('type', 'file');
        }

#### 动态设置菜单样式 ####

<span [ngClass]="{'menu_selected': item.RelationGUID === nowMenuGuid}">
      {
       {item.RightName}}
       <i nz-icon nzType="down" nzTheme="outline"></i>
    </span>

#### 原生js的DOM操作 ####

ngAfterViewInit(): void {
        const navbar = this.navbar.nativeElement;
        const parentLi = navbar.children;
        for (let i = 0 ; i < parentLi.length ; i++) {
            const childUl = parentLi[i].getElementsByTagName('ul')[0];
            if (childUl) {
                const childLi = childUl.children;
                for (let j = 0 ; j < childLi.length ; j++) {
                    childLi[j].onclick = () => {
                        const nowParentLi = childLi[j].parentNode.parentNode;
                        const parentSpan = nowParentLi.getElementsByTagName('span')[0];
                        parentSpan.style.color = 'red';
                    };
                }
            }
        }
    }

#### 动态设置表格中不同状态颜色 ####

<td [class]="'isEmergent' + item.IsEmergent">{
       {item.IsEmergentDisplay}}</td>

.isEmergent0 {
        color: #009933;
    }
    
    .isEmergent1 {
        color: #FF0000;
    }
    
    .isEmergent2 {
        color: #FF9900;
    }