Загрузить еще кнопку pu sh элемент вверх, а не вниз в приложении angular - PullRequest
Новая
       44

Загрузить еще кнопку pu sh элемент вверх, а не вниз в приложении angular

0 голосов
/ 01 августа 2020

У меня приложение angular. До сегодняшнего дня он отлично работает в Google chrome, но сегодня, когда я нажимаю кнопку «Загрузить еще», кнопка «Загрузить еще» все еще там, а pu sh каждый раз, когда 10 товаров наверху. Это означает, что когда мы нажимаем кнопку «Еще», некоторые данные загружаются, а кнопка «Еще» опускается при прокрутке, мы можем загрузить снова, но в моем случае кнопка «Загрузить еще» всегда на экране, а продукт загружает ее вверху. Изменение положения прокрутки и сохранение положения всегда на кнопке загрузки. Но в Microsoft Edge все нормально работает. Не могли бы вы помочь мне решить эту проблему. enter image description here

my html here..

   класс  star_border )   Unavailabe   {{fruit? .Description}}   call_missed_outgoing  ПОДРОБНЕЕ     {{фрукт? .Name}}  ( оценка  star_border )   Availabe  Unavailabe   {{fruit? .Description}}   call_missed_outgoing  ПОДРОБНЕЕ      hourglass_empty  Загрузить больше фруктов  Загрузить фрукты Подождите ...

и моя функция загрузки дополнительных здесь 

    onLoadMore(){
        this.isProgress = true;
        this.fruitService.getByCount(this.fruits.length).subscribe((res: any) => {
          if (res.obj != null) {
            let fruit = res.obj;
            let length = fruit.length;
            if(length < 4){
              this.noMore = true;
            }
            for(let i = 0; i < fruit.length; i++){
              this.fruits.push(fruit[i]);
            }
          }
          this.isProgress = false;
        }, e =>{      
          this.isProgress = false;
          this.noMore = true;
        });
      }

, и я загружаю здесь каждый маршрут 

    <mat-sidenav-container class="sidenav-container font-roboto">
      <!-- <mat-sidenav [opened]="showAllTabNav" #drawer class="sidenav" fixedInViewport> -->
      <mat-sidenav-content>
        <ng-content></ng-content>
        <div>
          <router-outlet></router-outlet>
        </div>
      </mat-sidenav-content>
    </mat-sidenav-container>

1 Ответ

1 голос
/ 09 августа 2020

У меня недавно возникла та же проблема в React с Chrome.

Исправление на данный момент - это добавить overflow-anchor: none; к CSS кнопки или даже к контейнеру содержимого

Более подробно я ответил здесь: { ссылка }

...