小编ooo*_*aya的帖子

我有一个大而合理数据量的网格(大约12,000个单元格...... 340列和34行).我知道这似乎是一个侧面的表,但它恰好发生在我们的应用程序中,它更可能有大量的列和更少的行.

当数据大约是2300个单元格(68列和34行)时,它足够快,我可以称之为"立即".我什么都不担心.

将其增加5倍会导致初始渲染时间呈指数增长.具体而言,在recursivelyCreateColumns方法中永久地创建列.

转到10x会导致需要几分钟才能完成.走到20,它没有崩溃,但是5分钟后它还在继续,我怀疑它需要一个小时或更长时间.

我的问题是,即使我为AG-Grid创建网格列/行/数据的代码在20ms范围内运行,我还能做些什么来让AG-Grid更容易创建列？也许它只在必要时创建列？

我的网格设置如下:

var gridOptions = {
    enableCellExpressions: true,
    columnDefs: data.header,
    rowData: data.body.data,
    floatingTopRowData: data.body.floatingTopData,
    rowHeight: 25,
    headerHeight: 25,
    enableColResize: true,
    enableSorting: true,
    enableFilter: true,
    getNodeChildDetails: function(rowItem) {
        if(rowItem.items) {
            return {
                expanded: scope.gridOptions.rowData[0].something === rowItem.something,
                group: true,
                field: "something",
                key: rowItem.something,
                children: rowItem.items
            };
        }
        return null;
    }
};

我知道在vanilla CSS中,没有办法创建"添加"属性.我的意思是:

.shade {
    background: rgba(0,0,0,.1);
}

<div class="shade">I have .1 black background</div>
<div class="shade shade shade">I also have .1 black background, but wouldn't it be cool if i had .3?</div>

我希望做的是避免在循环中生成样式,以便增加背景阴影的不透明度,而不必为每一个指定一个类,因为我不知道有多少.

我怀疑这是不可能的,因为它有点挫败了"CSS"中"C"的目的,这很好 - 但是我觉得如果有人比我更聪明,我会问.

我宁愿不这样做:

<div class="shade">
   <div class="shade">
     <div class="shade">
       No please
     </div>
   </div>
</div> 

我有两个指令,每个指令使用包含$ q/$ http调用的同一个工厂.

angular.module("demo").directive("itemA", ["restService", function(restService) {
    return {
        restrict: "A",
        link: function(scope, element, attrs) {
            restService.get().then(function(response) {
                // whatever
            }, function(response) {
               // whatever
            });
        }
    };
}]);


angular.module("demo").directive("itemB", ["restService", function(restService) {
    return {
        restrict: "A",
        link: function(scope, element, attrs) {
            restService.get().then(function(response) {
                // whatever
            }, function(response) {
               // whatever
            });
        }
    };
}]);

angular.module("demo").factory("restService", ["$http", "$q", function($http, $q) {
    return {
       get: function() {
           var dfd = $q.defer();
           $http.get("whatever.json", {
               cache: true
           }).success(function(response) {
              // do some stuff …

我有一个CMS,它强制页面的URL具有某种模式.我们需要有条件地重写这些链接的href.

CMS将在页面上打印如下内容:

<a href="/path/to/the/zoo/gorilla.html">Go</a>

我们的路由器需要实际指向

#/zoo/gorilla

如果我们自己写了这个链接,它看起来像:

<a ui-sref="zoo('gorilla')>Go</a>

问题是,我们不能总是保证/ zoo/gorilla部分意味着我们在动物园('gorilla').

最简单的方法是将CMS网址解析为路由器URL,然后执行以下操作:

link.attr("href", "#/zoo/gorilla");

我理解为什么这通常违背ui-router的想法,但我希望找到一种方法来使用它来解决这个奇怪的情况.

我有一个像这样的拖车:

$(".tab li").draggable({
    revert: true,
    delay: 1000,
    opacity: .75,
    helper: "clone",
    appendTo: "body"
})
.bind("dragstart", this.doSomething)
.bind("dragstop", this.undoSomething);

因此,在按住鼠标一秒钟之后,可以开始拖动.只要您在1秒后移动鼠标,此工作正常.移动鼠标后,立即调度dragstart事件.即使你没有拖动鼠标,我想要的是'dragstart'在1秒后触发.

我知道我可以这样做:

.bind("mousedown", this.setSomeIntervalAndWait)

但我需要访问作为draggable()的一部分创建的ui.draggable元素,因此mousedown/mouseup解决方案不会这样做.

这是否可以在不修改jQueryUI的情况下在延迟而不是鼠标移动时触发事件？我可以一起破解一些东西没有问题,使用超时,克隆对象,定位它并在'dragstart'上删除它但我希望有一些不那么复杂的东西.

我为此搜索并尝试了很多东西,我想也许我只是做错了.

我有一个单页面应用程序,它具有非常相似的DOM部分,仅通过从服务提供给它们的数据来区分.每个DOM部分都有不同的Web服务.

我的HTML看起来像这样

<div section="foo">
    <ul>
        <li ng-repeat="item in collection">{{item.name}}</li>
    </ul>
</div>
<div section="bar">
    <ul>
        <li ng-repeat="item in collection">{{item.cost}}</li>
    </ul>
</div>

在我的真实例子中,差异更为显着,所以我不能仅仅将"成本"改为"名称"并让它们相同.

我有一个看起来像这样的指令:

angular.module("App").directive("section", ["BaseProvider", function(provider) {
    return {
        restrict: "A",
        scope: {},
        link: function($scope, element, attrs) {
            provider.query(attrs.section).success(function(response) {
                $scope.collection = response; // ** pay attention to this line **
            });
        }
    };
}]);

所以,它调用BaseProvider的查询方法,传入DOM元素的section属性.所以,在我的例子中,"foo"或"bar".

BaseProvider看起来像这样:

angular.module("App").factory("BaseProvider", ["$http", function($http) {
    var urls = {
        foo: "/something/foo.v1.json",
        bar: "/something/bar.v2.json"
    };

    return {
        query: function(base) {
            return $http.get(urls[base]);
        }
    };
}]); …