angular / angular/components

Linear stepper behaving weird when going back a step

Đang mở
#8,948 5 bình luận 3 reaction 0 người được giao Xem trên GitHub
area: cdk/stepper G 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ả

#### Bug, feature request, or proposal:
The stepper has weird styles when going back and leaving invalid steps, and it's inconsistent with the styles than when going back and leaving valid steps. It's also possible to have a combination of both where some labels will look disabled and some labels will look enabled when in fact they are all disabled.

#### What is the expected behavior?
On a stepper with 3 steps: A, B, C. If A, B and C are filled, valid and we are at C. When going back to B and making it invalid, it should mark C as disabled.
Then when going back to A and making it invalid too it should make B and C look disabled

#### What is the current behavior?
If B is made invalid, then A is made invalid too, B looks disabled but we can;t navigate there (because A is invalid), and C looks enabled even though we can't actually navigate there.

#### What are the steps to reproduce?
https://angular-qwtmdt.stackblitz.io

1. Fill requirements on Step 1.
2. Fill requirements on Step 2.
3. Fill requirements on Step 3.
4. Go back to Step 2 and erase a required field.
5. Go back to Step 1 and erase a required field.

![image](https://user-images.githubusercontent.com/2022649/33862933-1da747aa-de9a-11e7-8b4c-c81fa7e345d2.png)

#### What is the use-case or motivation for changing an existing behavior?
Behavior is inconsistent between steps 2 and 3. And Step 3 seems to promise that it's enabled when it's not, making the UI confusing.

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à làm theo các bước được liệt kê để so sánh nhãn bước với khả năng điều hướng thực tế. Công việc hoàn tất khi việc vô hiệu hóa Step 2 rồi Step 1 khiến mọi bước tiếp theo không thể truy cập đều hiển thị nhất quán kiểu 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
Đặc tả 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.