使用angular js

Question

我试图隐藏/显示列类datatable-colvis-basic，但它只隐藏表头而不是数据。我认为因为我的动态表数据来自角js。什么是解决方案。

     <table id="table_id" class="table datatable-colvis-basic" id="DataTables_Table_0 " role="grid" aria-describedby="DataTables_Table_0_info" ng-show="numberLoad">
                <thead>
                    <tr> 
                        <th>#</th>
                        <th>Order Id</th>
                        <th>SKU</th>
                        <th>Vendor Name</th>
                        <th>Recived MP</th>
                        <th>Placed On MP</th>
                        <th>Placed On Date</th>
                    </tr>
                </thead>
                <tbody>
                   <tr dir-paginate="mplist in getMpList |  itemsPerPage:mpreportinfo.itemsPerPage" current-page="mpreportinfo.currentPage" total-items="total_count">
                        <td>{{$index + 1}}</td>
                        <td>{{mplist.order_id}}</td>
                        <td>{{mplist.sku}}</td>
                        <td>{{mplist.vendor_name}}</td>
                        <td>{{mplist.order_source_name}}</td>
                        <td>Amazon</td>
                        <td>{{mplist.placed_date}}</td>
                    </tr>
                </tbody>
            </table>

please check attached image

Answer 1

将ng-show放在表格内的元素中。

<table id="table_id" class="table datatable-colvis-basic" id="DataTables_Table_0 " role="grid" aria-describedby="DataTables_Table_0_info">
            <thead>
                <tr> 
                    <th>#</th>
                    <th>Order Id</th>
                    <th>SKU</th>
                    <th>Vendor Name</th>
                    <th>Recived MP</th>
                    <th ng-show="numberLoad">Placed On MP</th>
                    <th>Placed On Date</th>
                </tr>
            </thead>
            <tbody>
               <tr dir-paginate="mplist in getMpList |  itemsPerPage:mpreportinfo.itemsPerPage" current-page="mpreportinfo.currentPage" total-items="total_count">
                    <td>{{$index + 1}}</td>
                    <td>{{mplist.order_id}}</td>
                    <td>{{mplist.sku}}</td>
                    <td>{{mplist.vendor_name}}</td>
                    <td>{{mplist.order_source_name}}</td>
                    <td ng-show="numberLoad">Amazon</td>
                    <td>{{mplist.placed_date}}</td>
                </tr>
            </tbody>
        </table>

这里有一个使用angularJS和ng-show显示或隐藏列的示例。 我希望它对你有所帮助。 https://codepen.io/salva341/pen/oqyxKW