Angular ui-grid:在每个数据单元渲染时调用数据网格头部注入的方法

Angular ui-grid : Method injected inside header of data grid is being called for each data cell rendering

本文关键字：数据 数据网 调用 网格 头部 方法 注入 ui-grid Angular 单元      更新时间：2023-09-26

方法注入到数据网格的头部被调用为每个数据单元渲染，也被调用时，我们做水平或垂直滚动。为了再现这个问题，我在这里附上了plnkr链接。http://plnkr.co/edit/ZW43LsiLY7GdnX6XEOgG?p=preview,http://plnkr.co/edit/3E8HTz4Z2daGqRh1WHtx?p=preview(<div class="ui-grid-top-panel" style="text-align: center">{{grid.appScope.letter()}}</div> ，尝试排序，水平或垂直滚动)。

例如:下面是标题单元格视图模板，我们有injected {{ grid.appScope.getHeaderLetter( col.name, $parent.$index )}}，当我们做水平或垂直滚动或在初始单元格渲染时，getHeaderLetter方法正在为每个数据单元格调用。换句话说，如果我们有100000个单元格，那么方法被调用100000次。我想我在用例方面漏掉了一些重要的事实。我将非常感谢您对此的评论。

——头定义

<div class="ui-grid-top-panel ui-grid-top-panel-single" id="{{'ui-grid-index-' + col.name  }}" style="text-align: center">
  <div class="ui-grid-alphbet ui-grid-alphbet-first">{{ grid.appScope.getHeaderLetter( col.name, $parent.$index ) }}
  </div>
     .
     .
     .
     more code
我在这里也问过同样的问题……

这就是角检查的工作方式。你对此无能为力。只是尽量不要在这样的函数中放置长时间运行的操作。

这样行吗:

  $scope.letterFn = function () {
    console.log("CHANGE LETTER")
    return i;
  }
  $scope.letter = $scope.letterFn();

http://plnkr.co/edit/yF1sSG2QXeO9cFNAeDYm?p =预览

相关文章：