Entrar Ainda não tem acesso?
2
respostas

[Dúvida] [Fronted] Como fazer os templates no angular aparecer quando eu quero

por Luiz Carlos De Oliveira Júnior
| 67.9k xp | 31 posts

oi eu tenho um aduvida e a seguinde na minha aplicacao eu tenho a tela de login onde o usuário coloca o login senha (http://localhost:4200/#/) e depois vai para a tela home (http://localhost:4200/#/Home) chegando nessa tela eu tenho varia s funiconalidades umas elas e 'dados' quado clico em dados era pra ir para outra tela, so que chegando nessa tela nao aparece a barra lateral e nem o cabecalho .So que quando meu usuario esta logado na tela (http://localhost:4200/#/Home) fica dessa forma Insira aqui a descrição dessa imagem para ajudar na acessibilidade

so que quando nao esta logado tambem fica dessa forma

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

so que eu nao quero que fique dessa forma oq eu quero e que fique apenas o login e quando o user estiver logado ai sim apareca a barra lateral e o cabeçalho

no meu app.componet fica dessa forma 

 
    <app-barra-lateral></app-barra-lateral>
    <app-cabecalho></app-cabecalho>
    <router-outlet></router-outlet>
2 respostas
por HILTON ELEUTERIO DOS SANTOS JUNIORR
| 77.5k xp | 44 posts
Fiscal de Aviação Civil.

boa noite! Luiz,

para que isso seja feito, voce vai ter que ir no CSS do app-barra-lateral e aplicar um display: none; (dessa forma ele nao apararecera na tela).

e criar uma javascript com uma condição que quando o seu login for aceito adicione o display:block;

assim o formulário vai ficar escondido e quando o seu login for validado esse classe será adicionada.

poder ser que programadores mais experientes realizem isso de outra forma, mas pelo meu nível de conhecimento e assim que realizado.

espero te ajudado.

obrigado.

por Luiz Carlos De Oliveira Júnior
| 67.9k xp | 31 posts

bom dia Hilton eu consegui ajusta o codigo de login da seguinte forma , nos componentes .ts da barra lateral e cabeçalho coloquei esse codigo trabalhando com async pipe

.

@Component({
  selector: 'app-barra-lateral',
  templateUrl: './barra-lateral.component.html',
  styleUrls: ['./barra-lateral.component.css']
})
export class BarraLateralComponent {

  usuario$: Observable<User | null>;

  constructor(
    private route: Router,
     private user: LoginService) {
    this.usuario$ =  this.user.getUsuario();  
  }

}

; e nos respectivos codigos html coloquei esse codigo

;

<html  *ngIf="usuario$ | async as user;">
<head>
</head>
....

e o metodo getUsuario e assim

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

para a tela de login ate funciona porem quando chega na tela de

**autentenficacao2FA ** .

Insira aqui a descrição dessa imagem para ajudar na acessibilidade