ng-table icon indicating copy to clipboard operation
ng-table copied to clipboard

loading effect

Open yujiayinshi opened this issue 9 years ago • 8 comments

When loading data from server,always need to wait several seconds,and there shows blank,so, is there any simple ways to show loading text ?

yujiayinshi avatar Oct 14 '15 06:10 yujiayinshi

+1, want this feature too.

youhan26 avatar Oct 14 '15 08:10 youhan26

+1

thanhlq avatar Oct 14 '15 09:10 thanhlq

+1

c1rus avatar Oct 23 '15 06:10 c1rus

+1

LiHaoGit avatar Nov 13 '15 08:11 LiHaoGit

+1

mike131 avatar Nov 13 '15 19:11 mike131

感觉加载数据的时候好卡啊 有没有解决方案啊?

amormason avatar Dec 12 '15 08:12 amormason

Do you talk about the filter delay?

If its just a loading effect when retrieving data from server, you can use ngAnimate and css with a loading boolean set when you call the getData() function:

settings.getData = function (params: ng.ngtable.ITableParams): ng.IPromise<Array<T>> {
                    self.isLoading = true;
                    return self.itemsFunction(self.specification).then((result: IGridItemWrapper<T>): Array<T> => {
                        self.setItems(result.Items);
                        self.isLoading = false;
                        params.total(result.Count);
                        return result.Items;
                    }).catch((error) => {
                        self.isLoading = false;
                    });
};

And then add a css class on table:

<table ng-table="plc.tableParams" ng-class="{'loading': plc.isLoading}">

and its relative in css:

.loading-remove {
    transition:all cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s;
}
.loading,
.loading-add.loading-add-active {
    opacity: 0.5;
    //animation: blinker 0.5s cubic-bezier(.5, 0, 1, 1) infinite alternate;  
}
.loading-remove.loading-remove-active {
    opacity: 1;
}
@keyframes blinker {  
    from { opacity: 1; }
    to { opacity: 0.5; }
}

okamiconcept avatar Dec 16 '15 11:12 okamiconcept

No working any more.

nikunj2512 avatar Jan 04 '18 18:01 nikunj2512