Mat-tab-group angular вкладка переключения вкладки компонента сама по себе - PullRequest
0 голосов
/ 26 мая 2020

У меня есть пользовательский отчет о том, что когда они постоянно переключаются между вкладками, пока данные все еще загружаются (отдельные вызовы API для каждой вкладки), вкладки начнут переключаться самостоятельно, и пользователь должен обновить sh страницу, чтобы восстановить контроль.

https://streamable.com/nu5l2s

Я попытался отключить анимацию, но проблема не исчезла. Я попытался отключить / отложить переключение вкладок, пока каждая вкладка не завершит загрузку данных sh, но я хочу знать, есть ли лучший способ, позволяющий пользователям переключаться между вкладками.

вот фрагмент кода с одной вкладкой . Каждая вкладка имеет одинаковый лог c

<mat-tab-group [@.disabled]="StopTabSwitchingAnimation" color="accent" class="demo-tab-group" [selectedIndex]="TabStateHelper.ConversationsListTabSelectedIndex" (selectedTabChange)="tabChanged($event)">
  <mat-tab>
    <ng-template mat-tab-label>
      Active &nbsp;<span *ngIf="TotalActiveConversationCount" class="tab-message-count">{{TotalActiveConversationCount}}</span>
    </ng-template>
    <ng-template matTabContent>
        <div class="demo-tab-content" infiniteScroll [infiniteScrollDistance]="0.7" [infiniteScrollThrottle]="100" (scrolled)="onScrollDown()"
                [scrollWindow]="false">
            <app-all-conversations [Conversations]="Conversations"></app-all-conversations>
            <div *ngIf="LoadingActiveConversations" class="loading-conversations">
                <mat-sourcing-spinner [IsSpinnerActive]="LoadingActiveConversations" [IsLoadingList]="true"></mat-sourcing-spinner>
            </div>
        </div>
    </ng-template>
  </mat-tab>

....

</mat-tab-group>
constructor(private _conversationService: ConversationService,
    private _authService: AuthenticationService) {
    this.TabStateHelper = TabStateHelper.Instance;
  }

public tabChanged(event: MatTabChangeEvent): void {
    this.TabStateHelper.ConversationsListTabSelectedIndex = event.index;
  }
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...