Listing data with PickList

The PickList component is used to move items between two different lists. You can also reorder the items within each list. This provides the overall status of selected items. The items can be moved/reordered using either default button controls or drag and drop behavior. PickList requires two arrays, one is used for the source list and other one is for the target list. The ng-template template tag is used to display the item's content where each item in the array can be accessed using a local ng-template variable.

A basic example of the PickList component with country information would be written as follows:

<p-pickList [source]="sourceCountries" [target]="targetCountries"
  [sourceStyle]="{'height':'350px'}" [targetStyle]="{'height':'350px'}">
  <ng-template let-country pTemplate="item">
    <div class="ui-helper-clearfix">
      <img src...