Блог

Я создаю несколько таблиц динамически, в каждой из которых есть несколько строк, которые также создаются динамически с использованием Angular.

Моя цель — скрыть каждую таблицу, если в tbody этой таблицы нет видимых строк.

 <table ng-repeat="package in listOfPackages" ng-if="this.getElementsByTagName('tbody')[0].childNodes.length > 0 ">
  <tbody>
    <tr ng-repeat="thing in package.things" ng-if="thing.status === 'interesting'">
      <td>{{thing.someInfo}}</td>
      <td>{{thing.someOtherInfo}}</td>
    </tr>
  </tbody>
</table>
  

Строка ng-if="this.getElementsByTagName('tbody')[0].childNodes.length > 0" , похоже, является моей проблемой — я не знаю правильного способа найти собственные дочерние элементы элемента и проверить, сколько их у него видно.

Есть ли какой-либо возможный способ сделать это в angular?

создайте функцию в своем контроллере, что-то вроде

 $scope.showPackageTable = function (package) {
    var toShow = false;
    for (var thing in package.things) {
        if (thing.status === 'interesting') { toShow = true; }
    }
    return toShow;
}
  

затем вы можете использовать это в своем html ng-if="showPackageTable(package)"