想在angular2中将条件放在上传图片中

时间:2017-08-19 05:50:22

标签: angular

我想在我提交或保存表格时放入条件,否则文件更改功能调用。如何将这个条件放在下面的代码中?

这是图片上传的表单模板:

  <form name="form" (ngSubmit)="f.form.valid && save()" #f="ngForm" novalidate enctype="multipart/form-data">
        <div>
            <input type="file" (change)="fileChange($event)" placeholder="Upload file">
            <img [src]="employee.profile_image_url" height="50" width="50">
        </div>
 </from>

它在组件中的表单保存功能:

save(): void {
    if (this.employee.bank_details == null) {
        this.employeeService.add_bankDetails(this.model, this.employee);
    }
    if (this.employee.current_address == null) {
        this.employeeService.add_addressDetails(this.model, this.employee);
    }
    if (this.employee.permanent_address == null) {
        this.employeeService.add_PaddressDetails(this.modelP, this.employee);
    }
    this.employee.full_name = (`${this.employee.first_name} ${this.employee.last_name}`);
    this.employeeService.update(this.employee);
}

它是组件中图像上传的文件更改事件:

fileChange(event: any) {
    const imageFolder: string = this.employee.id;
    const fileList: FileList = event.target.files;
    const file: File = fileList[0];
    const storageRef = firebase.storage().ref().child(`${imageFolder}/profile.jpg`).put(file)
    .then((snapshot) => {
    this.employee.profile_image_url  = snapshot.downloadURL;
 console.log(snapshot.downloadURL);
});

}

1 个答案:

答案 0 :(得分:0)

据我所知,我应该做以下事情:

<强> HTML

<form name="form" (ngSubmit)="f.form.valid && save(filename.value)" #f="ngForm" novalidate enctype="multipart/form-data">
    <input #filename type="file" placeholder="Upload file">
    <img *ngIf='isSaved' [src]="employee.profile_image_url" height="50" width="50">
</from>

<强>打字稿:

save(fileName:string): void {
    if (this.employee.bank_details == null) {
        this.employeeService.add_bankDetails(this.model, this.employee);
    }
    if (this.employee.current_address == null) {
        this.employeeService.add_addressDetails(this.model, this.employee);
    }
    if (this.employee.permanent_address == null) {
        this.employeeService.add_PaddressDetails(this.modelP, this.employee);
    }
    this.employee.full_name = (`${this.employee.first_name} ${this.employee.last_name}`);
    this.employeeService.update(this.employee);
    //here you call file changing function
    fileChange(fileName);
}


fileChange(event: any){
  ....
  //add this at the end
  isSaved=true;
}