As mentioned earlier, the multiple selection is enabled by default with multiple checkbox controls having the same group name. In this case, the model property binds to an array to hold selected values. By assigning the individual checkbox values to the selected values, the checkbox group is displayed with preselection. The multiple checkbox selection for selecting different favorite Angular versions would be as follows:

<div class="ui-g" class="multicheckbox-width">
  <div class="ui-g-12"><p-checkbox name="angulargroup"  
    value="AngularJS1.0" label="AngularJS V1.0"
    [(ngModel)]="selectedVersions"></p-checkbox>
  </div>
  <div class="ui-g-12"><p-checkbox name="angulargroup" 
    value="AngularV2.0" label="Angular V2.0"
    [(ngModel)]="selectedVersions"></p-checkbox>
  </div>
  <div class="ui-g-12"><p-checkbox name="angulargroup" 
    value="AngularV4.0" label="Angular V4.0"
    [(ngModel)]="selectedVersions"></p-checkbox>
  </div>
</div>

The checkbox group will be displayed with the default selection, as shown in the following screenshot:

To notify the checkbox selections, there is one event callback named onChange that will be invoked on user actions. At the same time, the user actions are disabled through the disabled property.