为什么每个连续的“加载更多”在角度 7 中花费更多时间?

问题描述

在 angular 7 项目中有一个事件列表页面,数据限制只有 10 个。但是在每次连续加载更多点击时,加载数据需要更多时间。尽管对 api request(.net) 的调用以毫秒为单位,但计时以秒为单位。

enter image description here

调用 api 后,我正在处理数据,以便根据日期和时间间隔将它们分组,并在 2 个相等的列中显示召集人数据,如下所示。

    if ( dotnetresponse.status == 'Ok' ) {
        this.schedule_data = dotnetresponse.programmes;
        var groupByInterval = {};                   
        let c = this.schedule_data;    
        this.schedule_data.forEach( function( a,b,c ) {
            a.class = '';
            if ( b > 0 ) {
                if ( a.dateInterval != c[b - 1].dateInterval ) {
                    a.class = 'blue-separator';
                }
            } else if ( b == 0 ) {
                if ( a.dateInterval == c[b].dateInterval ) {
                    a.class = 'blue-separator';
                }
            }    
            if ( a.convenors.length > 0 ) {
                var leftConvenor = [];
                var rightConvenor = [];
                var convenor_count = a.convenors.length;
                var convenor_half_count = Math.round( convenor_count / 2 );
                if ( 1 == convenor_count ) {
                    leftConvenor = a.convenors;
                }
                if( 1 < convenor_count ) {
                    a.convenors.forEach( function ( a,b ){
                        if ( b < convenor_half_count ) {
                            leftConvenor.push( a );
                        } else {
                            rightConvenor.push( a );
                        }
                    });
                }
            }    
            groupByInterval [ a.dateInterval ] = groupByInterval [ a.dateInterval ] || [];
            groupByInterval [ a.dateInterval ].push({ val : a,lConvenor : leftConvenor,rConvenor : rightConvenor });
                    });     
            var myArray1 = Object.keys( groupByInterval ).map( function( key ) {
            var interval_arr = key.split( '|' );
            var day  = interval_arr[0];
            var time = interval_arr[1];
                            
            return { interval: key,values: groupByInterval[ key ],day: day,time: time,eventSeparatorClass: groupByInterval[ key ][0].val.class };
   });
            let last:any = this.scheduleDotNetData[ this.scheduleDotNetData.length - 1 ];
            for ( let value of myArray1 ) {
                if ( last.interval == value.interval ) {
                    for( let val of value.values ) {
                        this.scheduleDotNetData[this.scheduleDotNetData.length-1].values.push(val);
                    }
                } else {
                    this.scheduleDotNetData.push( value );
                }
            }
            let count = this.schedule_data.length;    
            if ( count >= dotnetresponse.limit ) {  
                this.showMoreButton = true;
                this.filterCount = 1;
            } else {
                this.showMoreButton = false;
                this.filterCount = 0;
            }    
            this.loadMoreButton = false;            
  }

知道发生了什么以及如何解决这个问题吗? 欢迎提供任何帮助/建议。

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

错误1:Request method ‘DELETE‘ not supported 错误还原:...
错误1:启动docker镜像时报错:Error response from daemon:...
错误1:private field ‘xxx‘ is never assigned 按Alt...
报错如下,通过源不能下载,最后警告pip需升级版本 Requirem...