A Chip is customized using the ng-template element where the value is passed as the implicit variable. The content of ng-template consists of normal text, icons, images, and any other components. Remember that a customized Chip component doesn't have a cross icon, that is, we can remove the Chip entry with backspace only. The customized example of the Chip component with icons would be as follows:
<p-chips [(ngModel)]="complexcontacts" name="template">
<ng-template let-item pTemplate="item">
<i class="fa fa-address-card"></i>-{{item}}
</ng-template>
</p-chips>
In the preceding example, customized content is displayed with the company logo and the contact name. The following screenshot shows a snapshot result of the customized Chip example:
The Chips' user entry actions will be controlled using the max and disabled properties. The maximum number of entries...
