如何在角连接3个输入?

Question

我需要连接3个输入，并使一个值在angular typescript中代表一个日期。

这是我的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> 

我FormGroup:

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");

演示