在ng-repeat過濾器上調整大小

Question

我目前在嵌入到iframe中的AngularJS應用程序中需要調整其大小以避免滾動條。 我在應用程序中有一個函數可以計算容器的高度，然后調整iframe的大小。

當前，我正在使用指令（resizeAppPart），它將在范圍的最后一項上調用resize函數。

指示：

app.directive('resizeAppPart', function () {
  return function (scope, element, attrs) {
    if (scope.$last) {
      Communica.Part.adjustSize();
    }
  }
});

布局：

<tr ng-repeat="task in filteredTasks = (tasks | filter:filters)" resize-app-part>                    
  <td><a href="{{spConfig.spHostUrl}}{{task.visit.ServerRelativeUrl}}/Lists/Actions/DispForm.aspx?ID={{task.Id}}">{{task.Task_x0020_Title}}</a></td>
  <td><span ng-repeat="user in task.assignees" ng-show="user.Title != ''">
  ...
</tr>

這可以在初始加載時起作用，但是如果我使用任何搜索框過濾列表，該指令將不會運行，因此您最終會遇到滾動條或數千個空白-都不是理想選擇。

過濾表格后，是否可以調用指令，甚至直接調用函數？

Answer 1

您需要放置一個$watch ，使用它：

app.directive('resizeAppPart', function ($timeout) {
  return function (scope, element, attrs) {
    scope.$watch('$last',function(){
        Communica.Part.adjustSize();
    }

    scope.$watch(attrs.filterWatcher,function(){
       $timeout(function(){
         Communica.Part.adjustSize();
       },100)
    })
  }
});

並以這種方式在html中稍作更改

<tr ng-repeat="task in tasks | filter:filters" resize-app-part filter-watcher={{filters}}>