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

366
Visualizações
*ngIf for html attribute in Angular2
<ion-navbar  hideBackButton >
  <ion-title> </ion-title>
  ...
  ...

I want hideBackButton to be there conditionally and I don't want to repeat the whole ion-navbar element with *ngIf. Is it possible to to apply *ngIf for hideBackButton attribute?

over 4 years ago · Santiago Trujillo
2 Respostas
Responde à pergunta

0

You have to provide null to boolean values for them to get removed,

<ion-navbar [attr.hideBackButton]="someExpression ? true : null">

otherwise angular creates

<ion-navbar hideBackButton="false">
over 4 years ago · Santiago Trujillo Relatório

0

You can leverage interpolation:

<ion-navbar [attr.hideBackButton]="someExpression">
  <ion-title> </ion-title>
  ...
...

If someExpression is null the attribute won't be present and if someExpression is an empty string, the attribute will be there. Here is a sample:

@Component({
  selector: 'my-app',
  template: `
    <div [attr.hideBackButton]="someExpression">
      Test
    </div>
    <div (click)="toggleAttribute()">Toggle</div>
  `
})
export class AppComponent {
  constructor() {
    this.someExpression = null;
  }

  toggleAttribute() {
    if (this.someExpression==null) {
      this.someExpression = '';
    } else {
      this.someExpression = null;
    }
  }
}

See this plunkr: https://plnkr.co/edit/LL012UVBZ421iPX4H59p?p=preview

over 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