I have an app that has a login page and a register page, so when I click on a button in both pages it has to change from one to other. That works! but when I added a code to hide a persistent menú the button mentioned befored stopped working.
This code consists of a promise.
I detect that when this part of the code is commented, the app works fine, so maybe the problem is with using promises in this part of the app
On login html
<div class="col-lg-4 col-md-4 col-sm-5 col-xs-5 paddingsLog">
<a routerLink="/registro" routerLinkActive="active">
<button type="button" class="btnGeneral btnWhite">Regístrate</button>
</a>
</div>
The same above for register
On app.module
export class AppComponent {
constructor(
private router: Router,
private activatedRoute: ActivatedRoute,
private location: Location
) {
this.menuAndTitle();
}
public menuAndTitle() {
let getUrl = new Promise((resolve, reject) => {
this.router.events.pipe(
filter(event => event instanceof NavigationEnd)
).subscribe(() => {
console.log("Nav ends" + this.activatedRoute);
let url = this.location.path();
resolve(url);
console.log("URL subscribe: " + url);
});
});
getUrl.then((url: string) => {
const urlActual = url;
console.log('Url actual: ' + typeof(urlActual) + ' | ' + urlActual);
if (urlActual.includes('registro')) {
this.canShowTemplate = false;
} else if (urlActual.includes('login')) {
this.canShowTemplate = false;
}
}
}
}
What I see is that the promise affects the behaviour of the routerLink directive, is it possible?