Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

336
Visualizações
angular template ngif not work before reload page

I'm facing a strange problem. I'm using angular 12 and after rendering, the page doesnt show the ngIF template. the input only loads after I reload the page

...imports

@Component 
...
export class VideoUploadComponent implements OnInit { 
 ... 
variables
...
  isFile: boolean= true;
 
  constructor(
   ...
  ) {
    
    this.isFile = true;
  }

  ngOnInit() {

  }

...
Component functions
...

  
  onRadioboxChange(event: any) {
    this.isFile = !this.isFile;
    console.log(this.isFile);
  }

  
}

here is the html

  <form
    ...
  >
   ...
          
          <input
           ...
            (change)="onRadioboxChange($event)"
          />
          <label class="btn btn-outline-primary" for="url">Endereço</label>
        </div>

        <div class="mb-3 mx-auto">
          <div *ngIf="isFile; else endereco">
            ...
              />
            </div>
          </div>
        </div>

        <ng-template #endereco>
           ...
          </div>
        </ng-template>
      </div>
      <div class="form-item">
      ...
  </form>
</div>

before reload antes do carregamento

after reload the page enter image description here

can someone help me with this issue?emphasized text

about 4 years ago · Santiago Trujillo
1 Respostas
Responde à pergunta

0

problem solved.

the *ngIf was not showing the content becouse i was not using routerLink for navigate to the page

before

<li>
 <a class="dropdown-item nav-item" href="#/upload"**>
  Cadastrar</a>
 </li>

Solution:

<li>
<a class="dropdown-item nav-item" [routerLink]="['/upload']">
Cadastrar</a>
 </li>
about 4 years ago · Santiago Trujillo Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda