Within my Angular project (version 9.1.0), I have a class structured like this:
export class Contract {
contractName: string;
limit: number;
public getCatType(): string{
if(this.limit > 0) return 'p';
return 'n'; // simplified for brevity
}
}
I've incorporated this class in the template as follows:
<tr *ngFor="let c of contracts">
<td>{{c.contractName}}</td>
<td>{{c.limit | number}}</td>
<td>{{c.getCatType()}}</td>
</tr>
However, during runtime, the template raises an error stating c_r1.getCatType is not a function.
Upon investigation, I realized that the issue stemmed from the fact that "contracts" was populated by an API call result:
this.cService.getList(pId).subscribe((contracts: Contract[]) => {
this.contracts = contracts; // Suspected line causing the issue
}, (err) => {...});
Does anyone have insights on how to resolve this?
Check out a demo showcasing this error:
Thank you in advance.