在我的前端,我有一个包含3个字段的表单:
生日
昵称
描述
我设法记录用户输入的值,用console.log显示它们,但无法将它们发送回我的前端。控制台中没有弹出错误。。。我承认我完全迷路了。在我将如此多的信息放入表单之前,我只使用了一个description字段和一个req.body.xx,做了一些简单的事情,它干净地返回了所有信息。我也这么做,但更有价值。它不起作用
有什么想法吗?
<form name="form" [formGroup]="userForm" (ngSubmit)="onSubmit()" style="margin-top: 10px; display: flex;flex-direction: column;padding: 10px;">
<div class="form-group flexVerticalAlign">
<input required formControlName="nickname" type="text" class="form-control" name="nickname" placeholder="Votre nom">
<mat-error style="text-align: center; margin-bottom: 10px;" *ngIf="userForm.get('nickname').invalid && userForm.get('nickname').dirty && userForm.get('nickname').touched">Entrez un pseudo valide (4 à 20 caractères)</mat-error>
</div>
<div class="formContainer row flexHorizontalAlign">
<mat-form-field appearance="fill" class="example-form-field col">
<mat-label>Date de naissance</mat-label>
<input matInput [matDatepicker]="datepicker" formControlName="birthdate">
<mat-error *ngIf="userForm.get('birthdate').invalid">Entrez une date valide</mat-error>
<mat-datepicker-toggle matSuffix [for]="datepicker"></mat-datepicker-toggle>
<mat-datepicker #datepicker>
<mat-datepicker-actions>
<button mat-button matDatepickerCancel>Retour</button>
<button mat-raised-button color="primary" matDatepickerApply>Valider</button>
</mat-datepicker-actions>
</mat-datepicker>
</mat-form-field>
</div>
<div class="form-group flexVerticalAlign">
<label for="description" style="margin-right: 10px;">Description</label>
<textarea required formControlName="description" type="text" class="form-control" placeholder="" name="description" rows="5"></textarea>
<mat-error style="text-align: center; margin-bottom: 10px;" *ngIf="userForm.get('description').invalid && userForm.get('description').dirty && userForm.get('description').touched">Entrez une description valide (4 à 150 caractères)</mat-error>
</div>
<div mat-dialog-actions class="flexVerticalAlign">
<button mat-flat-button id="submit" type="submit">Enregistrer</button>
</div>
</form>
我的组件
userForm = this.fb.group({
description: new FormControl('', [Validators.minLength(4), Validators.maxLength(150)]),
nickname: new FormControl('', [Validators.minLength(4), Validators.maxLength(30)]),
birthdate: new FormControl('')
});
async onSubmit(){
let result: any = await this.mainService.addAndUpdate(this.userForm.value);
if (result.success){
location.reload();
}
}
我的app.js
// add and update
app.post('/addAndUpdate', validateCookie, async (req, res) => {
//convert id to mongoose objectId
var mongoose = require('mongoose');
let userId = mongoose.Types.ObjectId(req.body.userId);
console.log(req.body)
// determinate age
var timeDiff = Math.abs(Date.now() - new Date(req.body.birthdate).getTime());
let age = Math.floor(timeDiff / (1000 * 3600 * 24) / 365.25);
let data = {};
if (req.body.description != "" && req.body.description != undefined){
data.description = req.body.description;
};
if (req.body.birthdate != "" && req.body.birthdate != undefined){
data.age = age;
};
if (req.body.nickname != "" && req.body.nickname != undefined){
data.nickname = req.body.nickname;
};
console.log(data);
console.log(data.age);
console.log(data.nickname);
console.log(data.description);
db.collection("users").findOneAndUpdate(
{
userId: req.body.userId
},
{
$set: {
description: data.description,
nickname: data.nickname,
birthdate: data.age
}
},
function (err, foundUser) {
if (err) {
res.status(201).send({
success: false,
'message': "Erreur lors de la recherche de l'utilisateur."
});
return console.log("error find user id in db: " + err);
}
if (foundUser){
return res.status(200).send({
success: true,
'message': "Infos modifiées."
});
}
});
});
暂无答案!
目前还没有任何答案,快来回答吧!