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}}>

在ng-repeat过滤器上调整大小

1 个答案: