Question

我的申请表中存在严重的性能问题。我正在使用角度和网格。在阅读了为什么我的应用程序运行缓慢之后，我被指示使用bindonce指令来克服潜在的Angular性能问题。

所以我在我的解决方案中添加了bindonce.js并在我的模块中注入了指令

HomeIndexModule = angular.module("HomeIndexModule", ['ngGrid', 'pasvaz.bindonce']);

我在标记中使用如下

<div class="gridStyle " bindonce data-ng-grid="gridOptions"></div>

我不确定这是否真的解除了网格绑定。

问题1：有没有人经历过这个过程可以指导我如何做到这一点，因为我只能在bindonce网站上找到ng-repeat的例子。

问题2：如何验证bindonce是否真的有效？

Answer 1

我在其他帖子中已经两次提到这个，我已经创建了我自己的bind-once指令，这个指令很小并且做得很好，我个人觉得这个插件过于复杂。

检查出来

app.directive('bindOnce', function() {
    return {
        scope: true,
        link: function( $scope ) {
            setTimeout(function() {
                $scope.$destroy();
            }, 0);
        }
    };
});

<div class="gridStyle" bind-once ng-grid="gridOptions"></div>

演示：http://plnkr.co/edit/4cBOEG?p=preview

类似的帖子：

Genuinely stop a element from binding - unbind an element - AngularJS

Answer 2

此更改修复了性能滞后，更改是在ng-grid.js行号1420中注释掉self.resizeOnData（）。

$scope.$on("ngGridEventData", function () {
//self.resizeOnData(temp);

Chrome事件pro-filer显示此方法被调用了太多次，看起来它正在调整数据源更改时网格中的所有单元格。我仍在测试找到副作用，但到目前为止所有以前的功能都正常工作，性能比我之前的性能提高了5倍。

如果你看到这个改变，其他任何事情让我知道

Answer 3

您应该仔细阅读文档。仅使用bindonce将无法获得您想要的效果。看看我创建的这个示例：http://plnkr.co/edit/GXkLWfFpfdJvPVyRMtpO - $timeout用于每秒调用$apply。两个元素具有相同功能的绑定，这些功能记录以控制作为参数传递的文本。正如您所看到的，仅使用bindonce不起作用 - just bindonce 文本仍在记录中，而带有bo-text 的仅出现一次。必须使用bo-text，bo-html等中的一个来实现绑定一次。

因此，在您的情况下，您需要修改ngGrid指令的模板，并用bo-*指令替换所需的每个正常绑定。在这里：How to render html formatted text in ng-grid column header我已经解释了如何做到这一点。

如何在ng-grid中使用bindonce指令？

3 个答案: