Hide/show div using angularjs

Question

which is initially hidden, on button click i want to show table rows which in turn get data from WCF service. I am new to angular so im not able to show the table on button click. it flickers and goes away.

.html snippet
       <div data-ng-hide="vm1.organizationNumber!=0 && !loading">
                    <div class="row">

                        <div class="col-sm-12 col-md-12 col-lg-12 table-responsive">
                            <table class="table table-bordered table-condensed table-hover  table-striped">
                                <thead>

                                    <tr style="white-space: nowrap;">
                                        <th>Organization #</th>
                                        <th>Contract #</th>
                                        <th>Plan #</th>
                                        <th>Company Name</th>
                                    </tr>
                                </thead>
                                <tr>
                                    <td>{{vm1.organization}}</td>
                                    <td>{{vm1.number}}</td>
                                    <td>{{vm1.PlanName}}</td>
                                    <td>{{vm1.EmployerName}}</td>
                                </tr>
                            </table>
                        </div>
                        </div>
                    </div>
                </div>

Answer 1

Here's an example: the "Switch" button will toggle a boolean variable called switch , and the div will be hidden or shown based on the value of that variable.

<button ng-click="switch = !switch">switch</button>

<div ng-hide="switch"></div>