Stepper (selectionChange) vs (selectionChanged) and [selectedIndex]
- 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:
```
Next
Previous (cancelled)
```
In the stepper control the (selectionChange) event cannot be used together with [selectedIndex], because changing the [selectedIndex] also triggers (selectionChange), so there is no way of cancelling the selection programatically, or implement other logic 'before' the change is executed.
Expected it to work as a standard html select control where:
- when changing the .selectedIndex the (change) event doesn't get automatically triggered
- the (change) event is triggered 'before' the change is finished, so it can be cancelled with event.preventDefault()
#### What is the expected behaviour?
- The current event should be renamed (selectionChange**d**) = 'after' the step has changed.
- Emit a new event (selectionChange) = 'before' the step has changed, with option to cancel the action, which doesn't get automatically triggered when selectedIndex changes.
#### What is the current behavior?
selectionChange = 'after' the step has changed, naming is confusing, gets triggered automatically with [selectedIndex]
#### What are the steps to reproduce?

1. Select step 2
2. Press Previous button (the action is cancelled programatically) - ok
3. Press step 1 header (step 1 is still selected, the action cannot be cancelled, selectedIndex remains on step 2)
StackBlitz: https://stackblitz.com/edit/angular-material2-issue-9lskal
#### What is the use-case or motivation for changing an existing behavior?
Be able to programatically enable/disable certain steps
#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
Material 5.1.0
#### Is there anything else we should know?
Hướng dẫn đóng góp
Hướng nghiên cứu
Bắt đầu bằng cách tái hiện hành vi trong StackBlitz được liên kết, tập trung vào mat-horizontal-stepper, selectedIndex và selectionChange. Theo dõi sự khác biệt giữa thao tác điều hướng của người dùng và các thay đổi selectedIndex bằng chương trình; được xem là hoàn thành khi ngữ nghĩa sự kiện là riêng biệt, hành động trước khi thay đổi có thể bị hủy và thông báo sau khi thay đổi vẫn khả dụng.
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
- Tính năng
- Độ khó
- 4/5
- Thời gian dự kiến
- 3-5 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
- 35/100