<div *ngIf="discoverZone">
  <of-key-value [key]="'Host Range'" [value]="hostRange"></of-key-value>
  <of-key-value [key]="'Port Range'" [value]="portRange"></of-key-value>
  <span *ngIf="discoverZone.discoverHost.discoverPort.includeTCP">TCP</span>
  <span *ngIf="discoverZone.discoverHost.discoverPort.includeUDP">UDP</span>

  <div *ngIf="services.length > 0">
      <p-overlayPanel #op>
        <div *ngFor="let service of services">
          {{service}}
        </div>
      </p-overlayPanel>

      <a style="cursor: pointer" (click)="op.toggle($event)">{{services.length}} services has selected.</a>
    </div>
</div>