title: dir-paginate with two dir-pagination-control
body: <p>at the moment I have list of events with a pagination on the bottom of the list. That works well, but now I want to add a addintional pagination on the to of the list. When I now change the pagination on the bottom the pagination on the top is not updated. </p>
  
  <p>My working code is: </p>
  
  <pre><code>&lt;tbody&gt;
          &lt;tr dir-paginate="event in events | orderBy:['id', 't']:true | itemsPerPage: dirPaginate.pageSize" current-page="dirPaginate.currentPage"&gt;
  
              &lt;td&gt;&lt;i class="{{ ::(event.el | eventtype).icon }}" tooltip="{{ ::(event.el | eventtype).tooltip }}"&gt;&lt;/i&gt;&lt;/td&gt;
              &lt;td class="hidden-xs"&gt;{{::event.nr}}&lt;/td&gt;
              &lt;td&gt;&lt;span ng-bind-html="::('' + event.tg | eventMessage:event.d:'html')"&gt;&lt;/span&gt;
                  &lt;span class="visible-xs"&gt; ({{::event.nr}})&lt;/span&gt;
              &lt;/td&gt;
              &lt;td&gt;{{ ::(event.t * 1000 | date:'mediumDate')}} &lt;span class="visible-xs"&gt;{{ ::(event.t * 1000 | date:'mediumTime')}}&lt;/span&gt;&lt;/td&gt;
              &lt;td class="hidden-xs"&gt;{{ ::(event.t * 1000 | date:'mediumTime')}}&lt;/td&gt;
          &lt;/tr&gt;
          &lt;/tbody&gt;
          &lt;tfoot&gt;
              &lt;tr&gt;
                  &lt;td colspan="5" class="paginationContainer"&gt;&lt;dir-pagination-controls&gt;&lt;/dir-pagination-controls&gt;&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/tfoot&gt;
  </code></pre>
  
  <p>How can I uptate both paginations when one of them is changed?  </p>