I'm in the process of extracting data from an object to use in a detailed view.
The structured data is as follows:
async createRecord() {
const user = await this.fbauth.authState.pipe(first()).toPromise();
const record = {};
record['Name'] = this.roomName;
record['Number'] = this.roomNumber;
record['Description'] = this.roomDescription;
record['User'] = { email: user.email };
this.crudService.create_NewRoom(record).then(resp => {
this.roomName = "";
this.roomNumber = undefined;
this.roomDescription = "";
this.roomUser = toString();
console.log(resp);
this.router.navigate(['rooms']);
})
.catch(error => {
console.log(error);
});
}
service.ts
read_Room(id) {
return this.firestore.doc('Rooms/' + id);
}
create_NewRoom(record) {
return this.firestore.collection('Rooms').add(record);
}
room.page.ts:
roomView(record) {
const navigationExtras: NavigationExtras = {
queryParams:{
info: this.crudService.read_Room(record)
}
}
this.router.navigate(["roomview"], navigationExtras);
}
}
roomview.page.ts:
constructor(private route: ActivatedRoute, private router: Router) {
this.route.queryParams.subscribe(params => {
if (params && params.info) {
this.data = params.info;
}
console.log(params);
});
}
roomview.page.html
<ion-card-title>
{{ data }}
</ion-card-title>
However, upon receiving the information, I only see:
{info: "[object Object]"} info: "[object Object]" proto: Object
Is there any way for me to display the actual data within the object, like Name and Number? I would greatly appreciate any assistance!