Ionic retrieve data from firebase: select and display to another page

hi i would like to ask how can I get the category name out then show the description and image to another page? Currently I able to show the category name snapshot, but I not sure upon click the category name and go to next page to show the description.

Above is my database with the fields ^^
the idea is to show the category on one page and upon click it will direct to next page to show the other fields.

This is

  <ion-item *ngFor="let category of Categorys" lines="full">

This is the

import { Component, OnInit } from '@angular/core';
import { CrudService } from '../services/crud.service';

export class ReadCategory {
  $key: string;
  category: string;

  selector: 'app-learn',
  templateUrl: './',
  styleUrls: ['./'],
export class CategoryPage implements OnInit {
  Categorys: ReadCategory[];

  constructor(private crudService: CrudService) { }

  ngOnInit() {
    this.crudService.getCategory().subscribe((res) => {
      this.Categorys = => {
        return {
 as ReadCategory

  todoList() {
    .subscribe((data) => {

CRUD Services:

import { Injectable } from '@angular/core';
import { AngularFirestore } from '@angular/fire/firestore';
import { Router } from '@angular/router';

export class ReadCategory {
  $key: string;
  category: string;
  providedIn: 'root'
export class CrudService {

    private ngFirestore: AngularFirestore,
    private router: Router
  ) { }

  getCategory() {
    return this.ngFirestore.collection('learn').snapshotChanges();

Any help appreciated! Thanks in advance!
result :

First of all add the click button with the element id as a parameter

<ion-item *ngFor=“let category of Categorys” (click)=“go_page_next(” lines=“full”>


Now in the next.ts page.
import the ActiveRoute and also your service to retrieve the data and check the retrieved id’s and the one transmitted as a parameter

this.tab_category =>{
if ( == {
key :,
description :[‘description’],
… :[…],

don’t forget to modify your routing to allow you to pass parameters to your page
path: ‘suivant/:id’,
loadChildren: () => import(’./suivant/suivant.module’).then( m => m.SuivantPageModule)