Quiero cambiar el nombre del botón en mi encabezado. Si voy a iniciar sesión, cambiará el nombre del botón a "Registrarse" y si voy a registrarme, cambiará el nombre del botón a "Iniciar sesión". Quiero cambiar el nombre del botón sin hacer clic en él. Mi problema es que cuando uso this.router.navigate(['login']) en otro componente, el nombre del botón no se cambia a "registrarse". ¿Cómo puedo hacer esto? Aquí está mi código:
encabezado.componente.ts
changedText() { if(this.router.url.includes('/signup')) { this.text = 'Login'; } else { this.text = 'Signup'; } }encabezado.componente.html
<button *ngIf="!IsLoggedIn()" mat-raised-button color="warn" class="add-button me-2" (change)="changedText()" (click)="toggleButton()">{{text}}</button>export class AppComponent implements OnInit { public text: string constructor(private route: ActivatedRoute) {} ngOnInit() { this.route.url.subscribe((url) => { this.text = url[0].path == 'signup' ? 'Signup' : 'Login' }); } }TS:
readonly label$ = this.router.events .pipe( filter(event => event instanceof NavigationEnd), map(event => event.url.includes('/signup') ? 'Login' : 'Signup') ); constructor(private readonly router: Router) { }HTML:
<button *ngIf="!IsLoggedIn()" mat-raised-button color="warn" class="add-button me-2" (click)="toggleButton()">{{label$ | async}}</button>