angular - 禁用按钮每次都不起作用

Question

这是我的 html 更新按钮代码。当我单击更新时，updateItem 是我的方法，此方法将起作用。

(button start) 
button class="button" type="submit"  *ngIf="update" (click)="updateItem(dashboard.value)" [disabled]="formDate.untouched &&formTask.untouched &&formDescription.untouched">Update(button end)

这是我的dashboard.component.ts 文件

edit(taskname:string){
       this.update=true;




       let fetchArray= JSON.parse(window.localStorage.getItem('key'));

this.editItem = fetchArray.filter(fetchArray => fetchArray.taskname == taskname);


        this.taskname=this.editItem[0].taskname;

        this.date=this.editItem[0].date;
        this.description=this.editItem[0].description;
        this.updateval=this.editItem[0].taskname;


   }


  updateItem(form: any):void{

     this.update=false; 

       this.taskname=form.taskname;

       this.date=form.date;
       this.description=form.description;
       form.taskname=this.updateval;
       this.taskUpdate=form.taskname;

        let inLocalStorage= JSON.parse(window.localStorage.getItem('key'));

          let itemUpdate={ "taskname":this.taskname , "date": this.date, "description": this.description};
          var j;



          for(var i=0; i< inLocalStorage.length; i++)
         {
           if (this.taskUpdate == inLocalStorage[i].taskname)
           {

             j=i;

           }

         }  

                 this.myArray.splice(j,1,itemUpdate);

             window.localStorage.setItem('key',JSON.stringify(this.myArray));

             this.match= JSON.parse(window.localStorage.getItem('key'));



}

当我单击编辑按钮时，更新按钮将在单击更新后显示，它将被禁用。

我希望每次单击编辑按钮时都应禁用更新

标签： angularangular4-forms

Answer 1

作为它的模板驱动形式，那么你应该有如下的 html

<input type="text" name="name" [(ngModel)]="model.task" #formTask="ngModel" required>

如果你有上面的 html 那么按钮标签就像

button class="button" type="submit"  
 ..other code
[disabled]="!formDate.dirty && !formTask.dirty && !formDescription.dirty

检查dirty告诉你元素是否修改的标志，因为untouched它没有多大帮助，它只是检查你是否触摸了元素。