Question

我正在使用angular和firebase进行项目，并且面临如何使功能同步工作的问题。所以我的contrat.ts看起来像这样：

import { Component, OnInit } from '@angular/core';
import { ContratService } from './contrat.service';
import { FormBuilder, FormGroup, FormArray} from '@angular/forms'

@Component({
  selector: 'app-contrat',
  templateUrl: './contrat.component.html',
  styleUrls: ['./contrat.component.css']
}) 
export class ContratComponent implements OnInit {
  today: number = Date.now();

  contrat: FormGroup;
  constructor(private fb:FormBuilder ,private contratService: ContratService) { }

  ngOnInit() {
    this.contrat=this.fb.group({
      id_Contrat : [''],
      Montant : [''],
      date : [''],
      id_Client : [''],
      id_Freelancer : [''],
      tache : this.fb.array([this.creatTache()])
    })
this.contrat.get('date').setValue(this.today);
  }


creatTache():FormGroup{
  return this.fb.group({
           tacheName: [''],
           paiement:[''],
           delai:['']
  })
}
public get tache(){
  return this.contrat.controls['tache'] as FormArray;
}
addTache(){
this.tache.push(this.creatTache());
}
removeTache(i:number){
  this.tache.removeAt(i);
}
try1(){
  let m=0;
  for(let t of this.contrat.get('tache').value){
    m= +m + +t.paiement;
   }

  this.contrat.get('Montant').setValue(m);
}

 try2(u){
  this.contratService.addContrat(u);
}
 onSubmit(i){
this.try1();
this.try2(i);

}

}

在try1（）方法中，我试图设置'Montant'的值
在try2（）方法中，我试图将数据发送到firebase

问题在于try2（）在try1（）之前执行

Answer 1

我只是在html中添加了一个属性

 <input formControlName="paiement" (input)="try1()" type="text">

我通过事件（输入）调用了try1（）方法，因此，每当用户触摸输入“ Paiement”时，“ Montant”的值都会改变。

Answer 2

尝试使用

this.contrat.patchValue({Montant: m});

代替setValue

Answer 3

JavaScript中的所有内容都是异步的。这意味着，如果一行代码正在等待某些内容（例如后端请求），那么它将继续进行下一行代码而不会停顿。

您能做的就是放纵。

    try1(){
      return new promise of((return) => {
      let m=0;
      for(let t of this.contrat.get('tache').value){
        m= +m + +t.paiement;
       }

      this.contrat.get('Montant').setValue(m);
      return();
     });
    }

     try2(u){
      this.contratService.addContrat(u);
    }
     onSubmit(i){
    this.try1().then(()=> {
    this.try2(i);
    });
   }

如何使功能按顺序执行

3 个答案: