angular / angular/angular

FR: Better default debugNames for internal signals (computed / input), especially for signal forms

Đang mở
#66,319 0 bình luận 6 reaction 0 người được giao Xem trên GitHub
area: forms forms: signals
Ngôn ngữ chính
TypeScript
Star
101k
Fork
27.5k
Merge trung bình
1 ngày 19 giờ
Pull request đã merge (30 ngày)
288

Mô tả

### Which @angular/* package(s) are relevant/related to the feature request?

_No response_

### Description

When debugging an app that uses signal forms, I tend to get error messages like

`ERROR RuntimeError: NG0950: Input "field" is required but no value is available yet. Find more at https://v21.angular.dev/errors/NG0950`

Example see e.g. https://stackblitz.com/~/github.com/ptandler/angular-signal-form-value-control-reactive-form-interop?file=src/main.ts

### Proposed solution

It would be amazing ❤️ if `form()` and the `[field]` directive could provide a better default debugName to easier detect which field is required, e.g.
- include the component's name (or selector) in which the directive or form is defined
- include the name of the element a directive has been bound to
- if assigned to a prop (input, form), include also the prop name (i.e. `class SomeComponent { myForm = form(signal()); }` -> something like `form@SomeComponent.myForm` and then nested `form.someField.andAnother@SomeComponent.myForm`

Is it possible to get some name from the current / given injection context?

### Alternatives considered

Well, for now, I set breakpoints and try to figure out the context myself 😁 If the app is small enough, then that's fine.

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

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

Hướng nghiên cứu

The issue names signal forms' form() API and the [field] directive but provides no files or tests. Start by tracing how their internal computed and input signals receive debug names, then assess what naming context is available from injection. Done would require an agreed naming scheme and tests covering the proposed form and field names.

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ó
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
25/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.