用户注册时，如何在警报中显示自动生成的(数据库中)主键accountNumber?Angular(前端)和web api

Question

console.log(数据(在浏览器中

这是console.log(data)中的添加帐户组件。我正在生成accountnumber，但我不知道如何在警报中显示它。

用户注册时，如何在警报中显示自动生成的(数据库中(主键accountNumber？我使用Angular前端和Web API作为后端。

AddAccount.ts组件

addForm: FormGroup;
submitted: boolean = false;
constructor(private formBuilder: FormBuilder, private router: Router,private userService: Addaccount ) { }
ngOnInit() {
this.addForm = this.formBuilder.group({
//accountNumber: [''],
firstName : [''],
middleName : [''],
lastName : [''],
fathersName : [''],
phoneNumber : [''],
emailId : [''],
aadharNumber : [''],
dob : [''],
address : [''],
occupationDetails : [''],
});
}
showMsg: boolean = false;
onSubmit() {
this.submitted = true;
if(this.addForm.invalid) {
return;
}
this.userService.createUser(this.addForm.value)
.subscribe( data => {
console.log(data) 
//this.router.navigate(['/account-detail']);
this.showMsg= true;
});

AddAccount.ts服务：

getUsers() {
return this.http.get<openacc[]>(this.baseUrl+'/SavingsAccount');
}
getUserById(id: number) {
return this.http.get<openacc>(this.baseUrl+'/SavingsAccount/'+id);
}

// Create User
createUser(user: openacc) {
return this.http.post(this.baseUrl+'/SavingsAccount', user);
}

// Modify User
updateUser(user: openacc) {
return this.http.put(this.baseUrl + '/SavingsAccount/' + user.accountNumber, user);
}

// Delete User
deleteUser(id: number) {
return this.http.delete(this.baseUrl + '/SavingsAccount/' + id);
}

Answer 1

根据方法名称"this.userService.createUser"，您将从addForm获得的数据发送到您的后台/API以创建"用户"。

在创建创建的用户的操作中，您的后台应该返回创建的新用户，该用户将具有DB给它的字段"accountNumber"。

然后，在您对方法"createUser"的订阅中，数据的类型将是由背面返回的"User"，只需执行"data.accountNumber"，您就可以访问该值。

我建议您在前端创建用户界面，并以这种方式处理(根据您的数据更改类型(

interface User {
accountNumber: string;
firstName : string;
middleName : string;
lastName : string;
fathersName : string;
phoneNumber : string;
emailId : string;
aadharNumber : string;
dob : string;
address : string;
occupationDetails : any;
}

addForm: FormGroup;
submitted: boolean = false;
constructor(private formBuilder: FormBuilder, private router: Router,private userService: Addaccount ) { }
ngOnInit() {...

this.userService.createUser(this.addForm.value)
.subscribe( (data: User) => {
console.log(data.accountNumber)