bug(Overlay): how can i set default panelClass to cdkConnectedOverlay
- 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ả
### Is this a regression?
- [x] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
19.x
### Description
### v19
In Angular CDK v19, I rewrote the overlay behavior to automatically apply different built-in panelClass values depending on the context. This allowed my custom default panelClass to coexist with user-provided panelClass values without being overridden.
```
@Injectable()
export class TestOverlay extends Overlay {
private getOverlayPanelClasses(config: OverlayConfig) {
let classes = ['test']; //'test' is only for examples
if (config.panelClass) {
if (Array.isArray(config.panelClass)) {
classes = classes.concat(config.panelClass);
} else {
classes.push(config.panelClass as string);
}
}
return classes;
}
create(config?: OverlayConfig): OverlayRef {
const overlayConfig: OverlayConfig = {
...config,
panelClass: this.getOverlayPanelClasses(config)
};
return super.create(overlayConfig);
}
}
```
### v21
After upgrading to Angular CDK v21 and switching to injection via the `CDK_CONNECTED_OVERLAY_DEFAULT_CONFIG` token, I found that whenever a component provides `cdkConnectedOverlayPanelClass` , the default panelClass I set through the default config gets completely overridden.
```
{
provide: CDK_CONNECTED_OVERLAY_DEFAULT_CONFIG,
useFactory: () => {
return {
panelClass: 'test',
};
}
}
```
There are many places in my project where cdkConnectedOverlayPanelClass is used. What should I change now?
### Reproduction
StackBlitz link:
Steps to reproduce:
1.
2.
### Expected Behavior
Provide a way to set a default class for panelClass.
### Actual Behavior
Setting CDK_CONNECTED_OVERLAY_DEFAULT_CONFIG is completely overridden by the custom input.
### Environment
- Angular: 21
- CDK/Material: 21
- Browser(s): any
- Operating System (e.g. Windows, macOS, Ubuntu):
Hướng dẫn đóng góp
Hướng nghiên cứu
Bắt đầu bằng cách truy vết cách CDK_CONNECTED_OVERLAY_DEFAULT_CONFIG và input cdkConnectedOverlayPanelClass được kết hợp trong phần triển khai overlay được kết nối. So sánh hành vi Overlay.create tùy chỉnh trong v19 với đường dẫn cấu hình mặc định trong v21, sau đó xác định một trường hợp kiểm thử có thể tái hiện cho thấy liệu các lớp panel mặc định và từ input có nên được hợp nhất hay khô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
- 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ần làm rõ
- Mức phù hợp với người mới
- 35/100