Pagination shown even though there is no data in angular
<p>Here is my code:</p>

<p>Buttons:</p>

<pre><code>&lt;li &gt;&lt;a data-ng-click="Data1 = true;Data2 = false; search.status = ''" href=""&gt;ALL PROJECTS&lt;/a&gt;&lt;/li&gt;
&lt;li &gt;&lt;a data-ng-click="Data2 = true;Data1 = false" href=""&gt;NOTIFICATIONS&lt;/a&gt;&lt;/li&gt;
</code></pre>

<p>Populated data on click of button:</p>

<pre><code>&lt;ul&gt;                                   
    &lt;li ng-show="Data1" dir-paginate="wd in workOrdersList | filter: search.status | filter: search.name | itemsPerPage: 10"&gt;
        &lt;a href=""&gt;
            &lt;h4&gt;{{wd.name}}&lt;/h4&gt;
        &lt;/a&gt;
        &lt;p&gt;Status: {{wd.status}}&lt;/p&gt;
    &lt;/li&gt;

    &lt;li ng-show="Data2"&gt;
        &lt;div ng-show="!notificationDataDashord.length"&gt;
                &lt;span&gt;No Notifications&lt;/span&gt;
        &lt;/div&gt;
    &lt;/li&gt;
&lt;/ul&gt;
&lt;dir-pagination-controls auto-hide="true"&gt;&lt;/dir-pagination-controls&gt;
</code></pre>

<p>Inside the controller:</p>

<pre><code>$scope.Data1 = true; 
$scope.Data2 = false;
</code></pre>

<p>I am using pagination directive from this link:</p>

<p><a href="https://github.com/michaelbromley/angularUtils/tree/master/src/directives/pagination" rel="nofollow">https://github.com/michaelbromley/angularUtils/tree/master/src/directives/pagination</a></p>