Angular UI Development with PrimeNG

Display complex information using template

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 ...