Navigate to a component on different module on button click

Question

I have 2 different modules, one is common UI module in which I have sso-Button Component, and other one is SSO Module, in which I have initiatesso Component.

There is a button in sso-button component, if click that button, it should redirect to initiatesso component.

I have tried following code.

Module: CommonUI Module Sso-button.component.html:

<button class="logo-button" (click)="alert()" style="position:absolute;"> 
</button>

Sso-button.component.ts:

  public alert() {
    alert("");
    this.router.navigateByUrl(`initiatesso`);    
   }

Module: SSO Module

sso.module.ts:

export const ssoRoutes: Routes = [

  {
    path: 'initiatesso',
    component: InitiatessoComponent
  }
];

@NgModule({
  imports: [    
    RouterModule.forChild(ssoRoutes),    
  ],
  declarations: [InitiatessoComponent],
  exports: [InitiatessoComponent]
})
export class SsoModule { }

initiatesso.component.html

 
initiatesso works!

initiatesso.component.ts

export class InitiatessoComponent implements OnInit {
  constructor() { }
  ngOnInit() {
  }
}

But on the button click I am not able to redirect to the initiatesso page, not sure where I am going wrong. Please help.