'Angular9 production build does not recognize template input variables (PrimeNG)

We use PrimeNG's (9.1.3) Table component to display table data pretty much everywhere in our application. Since a recent update from Angular8 to Angular9 (9.1.13), production build (ng build --prod) always fails with a lot of errors regarding PrimeNG template input variables.

This is the sap-list.component.html:

    <p-table [value]="sapCustomers">
          <ng-template pTemplate="header">
                <tr>
                    <th style="width:40px">ID</th>
                    <th>Nome</th>
                    <th>Codice SAP</th>
                    <th>Totale progetti</th>
                    <th style="width:50px">&nbsp;</th>
                </tr>
            </ng-template>
            <ng-template pTemplate="body" let-sap>
                <tr>
                    <td class="text-center">{{sap.id}}</td>
                    <td>{{sap.name}}</td>
                    <td>{{sap.sapCode}}</td>
                    <td></td>
                    <td class="text-center"><button class="btn btn-primary btn-sm" (click)="editRow(sap)"><i class="fa fa-edit"></i></button></td>
                </tr>
            </ng-template>
        </p-table>

While the controller sap-list.component.ts looks like this:

@Component({
    selector: 'app-sap-list',
    templateUrl: './sap-list.component.html',
    styleUrls: ['./sap-list.component.css']
})
export class SapListComponent implements OnInit {
    sapCustomers: SAPCustomer[];

    get ready() {
        return this.sapCustomers != null;
    }
    constructor(private data: CoreDataService, private modal: EciModalService) {
    }

    ngOnInit() {
        this.refresh();
    }
    refresh() {
        this.sapCustomers = null;
        this.data.getSAPCustomers().subscribe(res => {
            this.sapCustomers = res;
        });
    }
    editRow(sap: SAPCustomer) {
        // do stuff

    }
}

When I run ng build --prod it fails with the following error:

error TS2339: Property 'sap' does not exist on type 'SapListComponent'.

The error points to the following line:

<button class="btn btn-primary btn-sm" (click)="editRow(sap)"> Crea nuovo SAP </button>

Now, property sap doesn't exist on the component itself, since it's a template variable of PrimeNG.

It doesn't recognize the template input variable "sap" in the click event callback. Even if the same input variable is used a couple of lines before with a string interpolation syntax.

If I build without the --prod flag, it builds without errors but I don't think that's the correct solution to the problem.

Do you have any idea?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source