Question

在我的angular（8）应用程序中，这是一种反应形式，有两个字段。

出生日期（出生日期，日期类型）
和年龄

我已经实现了年龄计算，降低了选择Dob压延机的时间。代码如下

dob: new FormControl('', Validators.required),
 age: new FormControl('', Validators.max(120)),

和html：

<div class="row clearfix">
                      <div class="col-sm-3">
                        <div class="form-group">
                          <label for="dob">Date Of Birth (mm/dd/yyyy)
                            <span style="color: red;">*</span></label>
                          <div class="input-field col s12">
                            <input type="date" class="flatPicker" ngbDatepicker #d="ngbDatepicker" [readonly]="true"
                              [minDate]="{ year: 1900, month: 1, day: 1 }" formControlName="dob" [maxDate]="maxDate"
                              #dobToDisplay />
                            <button class="flatPicker" (click)="d.toggle()">
                              <span class="fa fa-calendar">{{dobToDisplay.value | date}}</span>
                            </button>

                            <div *ngIf="
                                patientForm.controls.dob.touched &&
                                !patientForm.controls.dob.valid
                              " class="text text-danger">
                              Date of Birth is required
                            </div>
                          </div>
                        </div>
                      </div>

                      <div class="col-sm-3">
                        <label for="age">Age<span style="color: red;">*</span></label>
                        <div class="input-field col s12">
                          <input id="age" type="text" formControlName="age" type="number" />
                          <div *ngIf="
                          patientForm.controls.age.touched &&
                          !patientForm.controls.age.valid
                        " class="text text-danger">
                        Age entry is wrong
                      </div>
                        </div>
                      </div>

现在正在呼叫valueChanges.subscribe

 ngOnInit() {
  this.dobValueChanged();
    this.ageValueChanged();

  }

和

dobValueChanged() {
    this.patientForm.get('dob').valueChanges.subscribe(
      (dob: Date) => {

        let oDob
        if (dob != null) {
          oDob = new Date(dob['year'], dob['month'] - 1, dob['day']);
          //console.log(oDob);
          const today = new Date();
          let age = today.getFullYear() - oDob.getFullYear();
          //console.log(age);

          // this.patientForm.setValue({ age: age });

          this.patientForm.patchValue(
            { age: age }
          );
        }

      }
    );
  }

它可以正常工作，并选择日期，它可以计算年龄并设置为我的年龄。现在，当在年龄字段中输入任何内容时，现在也要设置DOB。这就是方法。我要根据年龄来计算年份，而月份和日期将是今天的月份和日期。并转换为“ MM / dd / yyyy”并进行修补，仍然无法正常工作。

ageValueChanged() {
    const todayYear: number = this.today.getFullYear();
    this.patientForm.get('age').valueChanges.subscribe(
      age => {

        const today = new Date();

        console.log(todayYear);
        const calculatedDobYear = (todayYear - age) - 1;
        console.log(calculatedDobYear);


        const calculatedDob = new Date(calculatedDobYear, today.getMonth(), today.getDate());
        console.log(calculatedDob);

        const pipe = new DatePipe('en-US');

        const myFormattedDate = pipe.transform(calculatedDob, 'MM/dd/yyyy');
        console.log(myFormattedDate);

        // const toSet = this.datePipe.transform(calculatedDob, 'yyyy-MM-dd');

        // const toSet = calculatedDob.toISOString().substring(0, 10);

        //console.log(toSet);

        this.patientForm.patchValue(
          { dob: myFormattedDate }
        );
      }    
    );  
  }

Angular 8 Dob和年龄自动计算

0 个答案: