Hide menu items using Routes

0

I want to get information like the menu for a different route, for example, the "Mkt Place" client is not seen as "Seller" customer options, provided by the menu when the user enters the mktplace or 'seller' login "depending on the choice

<nav class="navbar-default navbar-static-side" role="navigation">
      <div class="sidebar-collapse">
        <ul class="nav metismenu" id="side-menu">
          <li class="nav-header">
            <div class="profile-element" dropdown>
              <img alt="image" class="img-circle" src="assets/images/profile_small.jpg">
              <a dropdownToggle>
                <span class="block m-t-xs"> <strong class="font-bold">Loja</strong> </span>
                <span class="text-muted text-xs block">Cliente<b class="caret"></b> </span>
              </a>
              <ul class="animated fadeInRight dropdown-menu" *dropdownMenu>
                <li><a href="#">Perfil</a></li>
                <li><a href="#">Contato</a></li>
                <li><a href="#">Mailbox</a></li>
                <li class="divider"></li>
                <li><a (click)="logout()">Sair</a></li>
              </ul>
            </div>
            <div class="logo-element">
              HUB
            </div>
          </li>
          <li [ngClass]="{active: activeRoute('starter')}" >
            <a [routerLink]="['/starterview']"><i class="fa fa-th-large"></i> <span class="nav-label">Menu 1</span></a>
            <ul class="nav nav-second-level collapse" [ngClass]="{in: activeRoute('starterview')}">
              <li><a>Cadastro Cliente</a></li>
              <li><a>Cadastro Mkt</a></li>
              <li><a>Dashboard v.5</a></li>
            </ul>
          </li>

          <li [ngClass]="{active: activeRoute('mktplace')}" *ngIf="nav.visible">
            <a [routerLink]="['/mktplace']"><i class="fa fa-th-large"></i> <span class="nav-label">Mkt Place</span></a>
            <ul class="nav nav-second-level collapse" [ngClass]="{in: activeRoute('mktplace')}">
              <li><a>Cadastro Produtos</a></li>
              <li><a>Pedidos</a></li>
              <li><a>Matchs de Produtos</a></li>
            </ul>
          </li>

          <li [ngClass]="{active: activeRoute('seller')}">
            <a [routerLink]="['/seller']"><i class="fa fa-th-large"></i> <span class="nav-label">Seller</span></a>
          </li>
        </ul>

      </div>
    </nav>

The user is fixed in the code still, I have the data fixed. Performing AuthService Validation

@Injectable()
export class AuthService {    
  constructor(
    private router : Router
  ) { }

  fazerLogin(usuario: Usuario){
    if(usuario.nome === '[email protected]' && usuario.senha === '123456' && usuario.tipo === 'mktplace'){
      this.router.navigate(['usuario0']);
    }

    else if(usuario.nome === '[email protected]' && usuario.senha === '123456' && usuario.tipo === 'seller'){
      this.router.navigate(['usuario1']);
    }

    else if(usuario.nome === '[email protected]' && usuario.senha === '123456' && usuario.tipo === 'channel'){
      this.router.navigate(['usuario2']);
    }

    else{
      alert('Dados inválidos');
    }
  }
}

I mapped this way:

  {
    path: '', component: BasicLayoutComponent,
    children: [
      {path: 'usuario1', component: PrimeiroComponent}
    ]
  },

  {
    path: '', component: BasicLayoutComponent,
    children: [
      {path: 'usuario2', component: SegundoComponent}
    ]
  },

  // App views
  {
    path: 'usuario0', component: BasicLayoutComponent,
    children: [
      {path: 'dashboard1', component: Dashboard1Component},
      {path: 'dashboard2', component: Dashboard2Component},
      {path: 'dashboard3', component: Dashboard3Component},
      {path: 'dashboard4', component: Dashboard4Component},
      {path: 'dashboard5', component: Dashboard5Component}
    ]
  },
  {
    path: 'dashboards', component: TopNavigationLayoutComponent,
    children: [
      {path: 'dashboard41', component: Dashboard41Component}
    ]
  },
  {
    path: '', component: BasicLayoutComponent,
    children: [
      {path: 'starterview', component: StarterViewComponent}
    ]
  },
  {
    path: '', component: BlankLayoutComponent,
    children: [
      { path: 'login', component: LoginComponent },
    ]
  },

  {path: '**',  redirectTo: 'starterview'}
    
asked by anonymous 19.12.2017 / 13:34

0 answers