angular / angular/components

MatPaginatedTabHeader doesn't scroll last tab fully into view

Đang mở
#17,853 6 bình luận 3 reaction 0 người được giao Xem trên GitHub
area: material/tabs P3
Ngôn ngữ chính
TypeScript
Star
25k
Fork
6.8k
Merge trung bình
1 ngày 8 giờ
Pull request đã merge (30 ngày)
91

Mô tả

#### Reproduction

Use StackBlitz to reproduce your issue: https://stackblitz.com/edit/components-issue-wsbxpk

Steps to reproduce:
1. Set selectedIndex to last tab
2. Render

#### Expected Behavior
![image](https://user-images.githubusercontent.com/44192365/69958526-4c755880-1505-11ea-9f3f-94b33d5e5541.png)

Selected tab is scrolled fully into view and righthand pagination button disabled just as if the user manually clicked on the last tab

#### Actual Behavior
![image](https://user-images.githubusercontent.com/44192365/69957955-0ff52d00-1504-11ea-8ddb-c6338163bbea.png)

Tab is only partially visible and pagination button remains enabled. When tab titles vary in size only a few pixels of the last tab are visible. Clicking on the last tab manually scrolls it fully into view.

#### Environment

- Angular: 8.2.14
- CDK/Material: 8.2.3
- Browser(s): Chrome, Firefox, Internet Explorer 11, Safari
- Operating System (e.g. Windows, macOS, Ubuntu): All

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Hướng nghiên cứu

Bắt đầu với bản tái hiện StackBlitz được liên kết và phần triển khai MatPaginatedTabHeader, đặt selectedIndex thành tab cuối cùng. So sánh kết quả render ban đầu với việc chọn thủ công tab cuối cùng, sau đó xác minh rằng tab được chọn hiển thị đầy đủ và nút phân trang bên phải bị vô hiệu hóa.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
angular, typescript
Lĩnh vực
frontend
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
45/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.