akveo / akveo/nebular

Allow Select, Autocomplete, and OptionGroup to content project arbitrary content

Đang mở
#3,007 1 bình luận 7 reaction 0 người được giao Xem trên GitHub
Ngôn ngữ chính
TypeScript
Star
8.1k
Fork
1.5k
Chỉ số merge pull request
Không có pull request nào được merge trong 30 ngày

Mô tả

### Issue type

I'm submitting a ...

* [ ] bug report
* [X] feature request

### Issue description

**Current behavior:**
At the moment, Select, Autocomplete, and Option Group only allow a limited set of html content to be content projected. All other content is lost.

* [Select allows](https://github.com/akveo/nebular/blob/d6374b1a1dbdfd99b23544b91a02a61871da7039/src/framework/theme/components/select/select.component.html#L27)
* nb-option
* nb-option-group

* [Autocomplete sllows](https://github.com/akveo/nebular/blob/d6374b1a1dbdfd99b23544b91a02a61871da7039/src/framework/theme/components/autocomplete/autocomplete.component.html#L9)
* nb-option
* nb-option-group

* [Option Group allows](https://github.com/akveo/nebular/blob/d6374b1a1dbdfd99b23544b91a02a61871da7039/src/framework/theme/components/option/option-group.component.ts#L41)
* nb-option
* ng-container

**Feature request:**
I'd like to propose that these components remove the list of allowed selectors and allow arbitrary content projection of content. The purpose is to allow additional customization of the components by the developer. This matches the behavior of other Angular component libraries such as Material.

Common situations I've seen where this would be helpful:

- Displaying non-selectable text in auto-complete / menus
- Displaying a loading indicator in the auto-complete menu when items are being searched for via network request
- Adding a custom search box within the nb-select popup that could be used to narrow the list of selectable items
- distinct from auto-complete and would support #1859 #2042 #2029
- Allowing groups of items to be conditionally displayed behind an *ngIf on an `ng-container`

A current, hacky, work around to get this behavior is to wrap your arbitrary content in a ``, set `[disabled]=true` so the menus ignore it, then use `::ng-deep` styling to remove the disabled styling.

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

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

Đánh giá

Issue này chưa được đánh giá.

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.