title: Ngx-pagination does not work for custom component
body: <p>I am trying to build a custom ngx-pagination for the library and I am</p>
  
  <p>referring the link <a href="https://github.com/michaelbromley/ngx-pagination" rel="nofollow noreferrer">https://github.com/michaelbromley/ngx-pagination</a> But I do not </p>
  
  <p>understand what I need to do to build the custom pagination.It does not respond to </p>
  
  <p>a click event.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table class="table"&gt;
    &lt;thead&gt;
      &lt;tr&gt;
        &lt;th&gt;SL&lt;/th&gt;
        &lt;th&gt;Ref&lt;/th&gt;
        &lt;th&gt;Project Name&lt;/th&gt;
        &lt;th&gt;Product Owner&lt;/th&gt;
        &lt;th&gt;Project Type&lt;/th&gt;
        &lt;th&gt;Remaining Days&lt;/th&gt;
        &lt;th&gt;Status&lt;/th&gt;
      &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody&gt;
      &lt;tr *ngFor="let project of projects  | paginate: { itemsPerPage: 7, currentPage: p } ;let ndx = index" &gt;
        &lt;td&gt;{{ndx+1}}&lt;/td&gt;
        &lt;td&gt;{{project.ref}}&lt;/td&gt;
        &lt;td&gt;{{project.projectName}}&lt;/td&gt;
        &lt;td&gt;{{project.productOwner}}&lt;/td&gt;
        &lt;td&gt;{{project.projectType}}&lt;/td&gt;
        &lt;td&gt;{{project.days}}&lt;/td&gt;
        &lt;td&gt;{{project.status}}&lt;/td&gt;
      &lt;/tr&gt;
     &lt;/tbody&gt;
  &lt;/table&gt;
  
    &lt;pagination-template #p="paginationApi"
                   (pageChange)="pageChange.emit($event)"&gt;
  
      &lt;div class="pagination-previous" [class.disabled]="p.isFirstPage()"&gt;
          &lt;a *ngIf="!p.isFirstPage()" (click)="p.previous()"&gt; &lt; &lt;/a&gt;
      &lt;/div&gt;
  
      &lt;div *ngFor="let page of p.pages" [class.current]="p.getCurrent() === page.value"&gt;
          &lt;a (click)="p.setCurrent(page.value)" *ngIf="p.getCurrent() !== page.value"&gt;
              &lt;span&gt;{{ page.label }}&lt;/span&gt;
          &lt;/a&gt;
          &lt;div *ngIf="p.getCurrent() === page.value"&gt;
              &lt;span&gt;{{ page.label }}&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;div class="pagination-next" [class.disabled]="p.isLastPage()"&gt;
          &lt;a *ngIf="!p.isLastPage()" (click)="p.next()"&gt; &gt; &lt;/a&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong>CUSTOM-COMPONENT.TS</strong></p>
  
  <pre><code>@Input() id: string;
  @Input() maxSize: number;
  @Output() pageChange: EventEmitter&lt;number&gt; = new EventEmitter&lt;number&gt;();
  page: number = 1;
  
   pageChanged(event){
      console.log("pageChanged");
    }
  </code></pre>
  
  <p>What else changes are required to make it work?Am I missing something here I have installed the library using npm.Please suggest.</p>