-
Notifications
You must be signed in to change notification settings - Fork 28
feat: convert selected to signal model with two-way binding
#496
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
9cb50d3 to
7ae8ca7
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull Request Overview
This PR refactors the datatable selection mechanism by migrating from an @Input() property to Angular's two-way binding model pattern. The selected property is now a signal-based model that supports two-way binding, and the SelectEvent interface and select output are deprecated in favor of using selectedChange with two-way binding.
- Converted
selectedfrom@Input()tomodel<TRow[]>()signal in both datatable and body components - Updated all references to
selectedto use signal getter syntaxselected() - Replaced array mutation operations with
selected.set()calls - Deprecated the
SelectEventinterface andselectoutput in favor of two-way binding
Reviewed Changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| src/app/selection/selection-single.component.ts | Updated example app to use two-way binding syntax [(selected)] and (selectedChange) event instead of deprecated (select) |
| projects/ngx-datatable/src/lib/types/public.types.ts | Added deprecation notice to SelectEvent interface |
| projects/ngx-datatable/src/lib/components/datatable.component.ts | Converted selected to model signal, updated all usages to call selected() and selected.set(), added deprecation documentation to select output, removed array mutation in onBodySelect |
| projects/ngx-datatable/src/lib/components/datatable.component.html | Moved selected binding from removed input to two-way binding on body component, updated selectedCount to use signal getter |
Comments suppressed due to low confidence (1)
projects/ngx-datatable/src/lib/components/datatable.component.ts:480
- Corrected spelling of 'controll' to 'control'.
* A flag to controll behavior of sort states.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Convert the selected input to a signal model.
BREAKING CHANGE: The selected input no longer mutates the original array
passed to the component. Applications that rely on the array being updated
in place must switch to two-way binding with [(selected)] to maintain
reactivity.
DEPRECATED: The `DatatableComponent.select` output is deprecated; use (selectedChange)
or two-way binding instead .
Before:
```html
<ngx-datatable [selected]="mySelection" (select)="onSelect($event)"></ngx-datatable>
```
After:
```html
<ngx-datatable [(selected)]="mySelection" (selectedChange)="onSelect({selected: $event})"></ngx-datatable>
<!-- or -->
<ngx-datatable [(selected)]="mySelection"></ngx-datatable>
```
7ae8ca7 to
8abd4b6
Compare
fh1ch
left a comment
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@spike-rabbit nice work here, thanks a bunch 🙇
LGTM 👍
What kind of change does this PR introduce? (check one with "x")
What is the current behavior? (You can also link to an open issue here)
The
selectedinput is decorator based and preserves the original array when mutated.What is the new behavior?
The
selectedinput is a model and no longer mutates the array.Does this PR introduce a breaking change? (check one with "x")
If this PR contains a breaking change, please describe the impact and migration path for existing applications:
The
selectedinput no longer mutates the original array passed to the component. Applications that rely on the array being updated in place must switch to two-way binding with[(selected)]to maintain reactivity.Other information:
The
DatatableComponent.selectoutput is deprecated; use(selectedChange)or two-way binding instead .Before:
After: