Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

330
Vistas
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 Respuestas
Responde la pregunta

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 Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda