Angular - NgIf not working on component: "NG0303: Can't bind to 'ngIf' since it isn't a known...

Discussão em 'Angular' iniciado por Vítor Magalhães, Fevereiro 7, 2025.

  1. I'm trying to use a ngif directive on a component, but keep getting the following error on the console: "NG0303: Can't bind to 'ngIf' since it isn't a known property of 'p'.", and the element just doesn't appear. Also, I'm using po-ui framework for some elements.

    Here goes the ts and html codes of the component:

    cadastro-usuario.component.ts:

    import { Component, OnInit } from '@angular/core';
    import { PoButtonGroupModule } from '@po-ui/ng-components';
    import { PoButtonGroupItem } from '@po-ui/ng-components';

    @Component({
    selector: 'app-cadastro-usuario',
    templateUrl: './cadastro-usuario.component.html',
    styleUrls: ['./cadastro-usuario.component.css']
    })
    export class CadastroUsuarioComponent implements OnInit {

    constructor() { }

    ngOnInit(): void {
    }

    buttons: Array<PoButtonGroupItem> = [
    { label: 'Vínculo', action: this.vinculo.bind(this) },
    { label: 'Endereço', action: this.endereco.bind(this) },
    { label: 'Contatos', action: this.contatos.bind(this) },
    ];

    vinculo() {
    alert("vinculo");
    }

    endereco() {
    alert("endereco");
    }

    contatos() {
    alert("contatos");
    }
    }


    cadastro-usuario.component.html:

    <p style="display:inline-block; margin-left:80px; margin-top:20px; width: 600px;">
    <po-button-group class="po-md-12" [p-buttons]="buttons"> </po-button-group>
    </p>

    <br>

    <p *ngIf="true" style="display:inline-block; margin-left:80px; margin-top:20px; width: 300px;">
    <po-input name="vinculo" p-label="Vínculo"> </po-input>
    </p>

    Continue reading...

Compartilhe esta Página