angular / angular/components

docs-bug(MatInput): How to nest / wrap material form controls

Đang mở
#23,850 11 bình luận 19 reaction 0 người được giao Xem trên GitHub
area: material/input docs good first issue help wanted 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ả

#### Documentation Feedback

I find myself getting stuck on this again and again, and I've been using angular and material since it's inception, so by now it should have stuck up there in the old noggin, but alas.

Today we have a basic tutorial on how to do a completely custom form field
https://material.angular.io/guide/creating-a-custom-form-field-control

but there is no tutorials examples of how to take an existing matInput mat-select or other form controls and wrap them into a component.
Usually we need to do this to DRY things up and not have to have the same error messages, options or reoccurring fields multiple times.

## These are some tutorials / examples I would like to see

**Custom component to wrap sub field names, validation and errors**
I have an Address FormGroup which contains
street, zipcode, city
and a couple of mat-form-fields with labels, inputs, errors
I now want to wrap this into a ``

**Custom `mat-select` with static list of values and validation**
I have a Language select that is reused in multiple places
I now want to use it ``

**Custom `input with some kind of dialog picker`**
A User picker, should display the user name when done, and an icon to the right much like a date picker.
but then in the dialog we have some custom logic to list all users, and the value that comes out of the picker should be the database id for the user.
``

## The struggles
Since matInput already implements ControlValueAccessor it must be possible to just provide / delegate functionality down to that child, but how?

I have multiple implementations of the above, but all of them feel over complicated, or the dirty state isn't working because of something.

We need best practices for creating wrapped form controls and form groups :)

Please let me know if you need more context or examples, I have plenty

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 hướng dẫn Angular Material được liên kết về cách tạo control trường biểu mẫu tùy chỉnh và so sánh hướng dẫn này với các ví dụ matInput, mat-select, form-group và picker được bọc theo yêu cầu. Xác định phạm vi và các mẫu được khuyến nghị trước khi thêm các tutorial; công việc được xem là hoàn tất khi tài liệu giải thích các control và group được bọc bằng các ví dụ đầy đủ, validation và hành vi của trạng thái biểu mẫu.

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
documentation
Loại issue
Tài liệu
Độ khó
5/5
Thời gian dự kiến
Hơn một tuần
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Cần làm rõ
Mức phù hợp với người mới
28/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.