Change a component through another component - Angular 8

Question

Guys, I have a Nav component where owns the company logo and a Home component, however, Home could not exist the logo I have in Nav. What would be the hidden forms of the logo when the home route was activated?

My Nav:

<nav>
  <div class="nav-wrapper">
      <a [routerLink]="['/home']" class="brand-logo"><img src="assets/images/logo.png"></a>
      <a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
      <ul id="nav-mobile" class="right hide-on-med-and-down">
        <li><a [routerLink]="['/quemsomos']" >Quem somos</a></li>
        <li><a [routerLink]="['/solicitaremprestimo']">Solicitar empréstimo</a></li>
        <li><a [routerLink]="['/emprestimosocial']">Empréstimo Social</a></li>
        <li><a [routerLink]="['/faq']">FAQ</a></li>
        <li><a [routerLink]="['/videos']">Vídeos</a></li>
        <li><a [routerLink]="['/contato']">Contato</a></li>
      </ul>
  </div>
  <a id="area-cliente" [routerLink]="['/area-do-cliente']">Área do cliente</a>
</nav>

<ul class="sidenav" id="mobile-demo">
  <li><a href="sass.html">Sass</a></li>
  <li><a href="badges.html">Components</a></li>
  <li><a href="collapsible.html">Javascript</a></li>
  <li><a href="mobile.html">Mobile</a></li>
</ul>

HOME

<header>
  <div class="row">
    <div class="col s12 m12 tittle">
      <h1>Home</h1>
    </div>
  </div>
</header>
<main>
  Conteudo
</main>

app.component.html

<link href="https://fonts.googleapis.com/css?family=Roboto+Slab&display=swap" rel="stylesheet">
<app-navbar></app-navbar>
<router-outlet></router-outlet>
<app-footer></app-footer>

Answer 1

You can validate it through the route, only show the logo if the route is different from /home.

First you need to import the router:

import { Router } from '@angular/router'; 

then add into the constructor:

constructor(public router: Router) {}

And in the component just add the *ngIf="router.routerState.snapshot.url !== '/home'"

<ng-container *ngIf="router.routerState.snapshot.url !== '/home'">
    <img src="assets/images/logo.png">
</ng-container>