Estoy trabajando en Angular 7, y estoy representando un <div> ... </div> basado en múltiples valores, estos valores los declaré en el archivo .ts como : Boolean = false; los valores se actualizarán en ngOnInit , pero para mi condición, se sigue redirigiendo a la página de inicio mientras se actualiza o se navega por primera vez a la página,

aquí mi plantilla

 <div (click)="audioToggleSearchDropdown($event)" class="search-blk" id="audio-search" *ngIf="audioSearchKey || radioSearchKey || podcastSearchKey "> <input class="searchboxEvent" (keypress)="audioeventHandler($event)" #suggestbox id="search-audio-search" [formControl]="audioSearchContnet" [(ngModel)]="audioSearchValue" placeholder="{{ 'HEADER.AUDIO_SEARCH_PLACEHOLDER' | translate }}" /> </div>

Y mi archivo .ts declaré las claves audioSearchKey , radioSearchKey podcastSearchKey como falsas,

 audioSearchKey: Boolean = false; radioSearchKey : Boolean = false; podcastSearchKey : Boolean = false;

Y en ngOnInit() puse una función para validar URL, y la función como,

 if( url === "audio" || url === "search") { this.audioSearchKey = false; this.radioSearchKey = false; this.podcastSearchKey = false; }else if (audioUrl.includes(url)) { this.audioSearchKey = true; this.radioSearchKey = false; this.podcastSearchKey = false; } else if(radioUrl.includes(url)){ this.audioSearchKey = false; this.radioSearchKey = true; this.podcastSearchKey = false; } else if(podcastUrl.includes(url)){ this.audioSearchKey = false; this.radioSearchKey = false; this.podcastSearchKey = true; } else{ this.audioSearchKey = false; this.radioSearchKey = false; this.podcastSearchKey = false; }

Después de agregar estos, mi página existente sigue redirigiendo a la página de inicio al hacer clic en un enlace y navegar a la página y mientras cada uno se actualiza. Si estoy eliminando la parte HTML con ngSi el resto de las funcionalidades y la página funcionan bien, si alguien sugiere qué error es exactamente.