ng-show for multiple value

Issue

This is my Table

 <table class="table table-bordered table-responsive table-hover add-lineheight table_scroll">
        <thead>
            <tr>
                <th ng-hide="hidecolumn == key" ng-repeat="(key, value) in localNew[0]">
                    {{key}}
                </th>
            </tr>
      </thead>
      <tbody>
            <tr ng-repeat="test in localNew">
                <td ng-hide="hidecolumn == key" ng-repeat="(key, value) in test">
                    {{value}}
                </td>
            </tr>
        </tbody>
    </table>

Here hidecolumn will hide my column which I don't want to show, e.g. in my controller this is my data:

$scope.localNew = [{ 'name': 'name1', 'age': 24, "salary": 2500, "s": 5 }, { 'name': 'name2', 'age': 26, "salary": 2600, "s": 5 }];

And this my hide column variable

$scope.hidecolumn = "salary";

This works fine.

I want to hide multiple columns, so my scope variable will be like

$scope.hidecolumn = "name,salary";

So how can I manage this in my HTML table to hide multiple columns?

Solution

You should rather use an array instead of a string :

$scope.hidecolumns = ['name', 'salary'];

and a function to check if the current column should be hide or not :

$scope.shouldHideColumn = function(column) {
  if ($scope.hidecolumns.indexOf(column.salary)) {
    return true;
  }

  return false;
};

and then in your HTML :

<th ng-hide="shouldHideColumn(value)" ng-repeat="(key, value) in localNew[0]">
  {{key}}
</th>

Answered By - maxime1992