How to define routes for loading previous component from the url which is having data?

Question

Following are my routes

const routes: Routes = [
  {
    path: 'nav',
    component:NavComponent,
    children:[
      {
        path: 'basic-profile',
        component: BasicProfileComponent
      },
      {
        path: 'search',
        component: SearchComponent
      },
      {
        path:'business-profile',
        component: BusinessProfileComponent
      },
      {
        path:'search/business-card-full-view/:businessAccountId',
        component: BusinessCardFullViewComponent,
      },
      {
        path:'messaging',
        component: MessagingComponent,
      }
   
    ]
  },
  
];

I am at URL

http://localhost:4200/nav/search/business-card-full-view/10

     {
        path:'search/business-card-full-view/:businessAccountId',
        component: BusinessCardFullViewComponent,
      },

I want to go the

http://localhost:4200/nav/messaging

     {
        path:'messaging',
        component: MessagingComponent,
      }

this URL by clicking one button.

<button mat-button routerLink="messaging">Message</button>

button is in BusinessCardFullViewComponent.

How can I do this?

I try redirectTo also

{
        path:'search/business-card-full-view/:businessAccountId',
        component: BusinessCardFullViewComponent,
        children:[
              {
                path:'messaging',
                redirectTo:'messaging',
              }
            ]
      },

But not working!

I do my work using Router as follows

messaging()
  {
    this.router.navigate(['nav/messaging']);
  }

It works..!