如何以角度连接3个输入？

Question

我需要连接 3 个输入，并在角度打字稿中创建一个代表日期的值。

这是我的 html 代码：

  <td>
                      <input type="text"  placeholder="jj" class="form-control" formControlName="jj" id="jj" name="jj" [hidden]="!chkEnable.checked" style="width:50%" />
                    </td>
                    <td>
                      <input type="text" placeholder="mm" class="form-control" formControlName="mm" id="mm"  name="mm" style="width: 50%"  [hidden]="!chkEnable.checked">
                    </td>
                    <td>
                      <input type="text" placeholder="aa" class="form-control" formControlName="aa" id="aa" name="aa" style="width: 50%"  [hidden]="!chkEnable.checked">
                    </td> 

我的表单组：

this.dateForm = this.formBuilder.group({
  jj: ['', Validators.required,Validators.max(2)],
  mm: ['', Validators.required],
  aa: ['', Validators.required]

});

提前致谢！

Answer 1

监听表单组值的变化。每次任何控制值更改时都会触发。您可以在此执行任何您想要的操作。

ngOnInit() {
  this.dateSubscription = this.dateForm.valueChanges
  .pipe(map(this.formatDate))
  .subscribe(d => console.log('MM/DD/YY', d));
}

销毁时取消订阅

ngOnDestroy() {
  this.dateSubscription.unsubscribe();
}

格式化日期方法

formatDate({ aa, jj, mm }: any): string {
  return new Date(jj + '/' + +mm + '/' + +aa).toLocaleString();
}

提交表单

<form [formGroup]="dateForm" (ngSubmit)="onSubmit()">

在 Ts 中，

onSubmit(): void {
    // all form data
    const fromData = this.dateForm.getRawValue();
    // generate date out of it
    const date = this.formatDate(fromData);
    // create request by adding formdata with date
    const request = { ...fromData, date };
    console.log(request);
    // API call or other operation
  }

将此 js 日期作为字符串传递给 laravel，并在 laravel 中将其转换为日期。 像这样的东西……

$jsDate = '11/12/2021, 12:00:00 AM';
echo date('Y-m-d', strtotime($jsDate));

// 或

$date=date_create("12/25/2021, 12:00:00 AM");
echo date_format($date,"Y/m/d H:i:s");

Demo