Skip to content

feat(list-picker): add textField, valueField and selectedValue properties - #6033

Merged
MartoYankov merged 5 commits into
NativeScript:masterfrom
sebawita:master
Jul 23, 2018
Merged

MartoYankov merged 5 commits into
NativeScript:masterfrom
sebawita:master

Conversation

@sebawita

@sebawita sebawita commented Jul 5, 2018

Copy link
Copy Markdown
Contributor

PR Checklist

What is the current behavior?

Currently if we pass and array of json objects to a listview, there is no simple way to make it display a specific field from each item.
Also, we can only get the selectedIndex, but there is no direct way to get the selected object, or even specify which property should be returned.

What is the new behavior?

Implements #1677

Adds new properties to the ListView component (textField and valueField - should be used with arrays of JSON objects):

  • textField - tells the listview which property should be used to display each item
  • valueField - tells the listview, which property should be used to update the selectedValue
  • selectedValue - is the property that will contain the selectedValue, if valueField is specified, then it will contain the value from that property, otherwise it will contain the whole selected item

Breaking changes

No breaking changes.

Demo app

I've added a sample in apps -> list-picker -> list-picker-json-array

sebawita added 2 commits July 5, 2018 17:22
textField and valueField - should be used with arrays of JSON objects
textField - tells the listview which property should be used to display each item
valueField - tells the listview, which property should be used to update the selectedValue
selectedValue - is the property that will contain the selectedValue, if valueField is specified, then it will contain the value from that field, otherwise it will contain the whole selected item
@ghost ghost assigned sebawita Jul 5, 2018
@ghost ghost added the in progress label Jul 5, 2018
@ns-bot

ns-bot commented Jul 5, 2018

Copy link
Copy Markdown

Please sign CLA at http://www.nativescript.org/cla

@ns-bot

ns-bot commented Jul 5, 2018

Copy link
Copy Markdown

CLA signature found, happy contributing!

@ns-bot ns-bot added cla: yes and removed cla: no labels Jul 5, 2018
@sebawita

sebawita commented Jul 5, 2018

Copy link
Copy Markdown
Contributor Author

An example of using the new properties:

<ListPicker items="{{ items }}"
  textField="name"
  valueField="role"
  selectedIndex="2"
  selectedValue="{{ selectedItem }}">
</ListPicker>

@MartoYankov MartoYankov changed the title feat(list-view): add textField, valueField and selectedValue properties feat(list-picker): add textField, valueField and selectedValue properties Jul 9, 2018
@ghost ghost assigned SvetoslavTsenov Jul 23, 2018
@MartoYankov
MartoYankov merged commit 9e2e8ec into NativeScript:master Jul 23, 2018
@ghost ghost removed the in progress label Jul 23, 2018
@larssn

larssn commented Oct 8, 2018 •

Copy link
Copy Markdown

It's unclear how selectedValue translates to Angular. How do you databind it there?

I've tried various ways:

(selectedValue)="selected = $event"
[selectedValue]="myObj?.field"

Doesnt seem to do anything.

Another thing. Binding the component via reactive forms will still bind just the index, and not the valueField:
<ListPicker formControlName="printerUid" ...></ListPicker> (This will bind 0,1,2 etc. to the field printerUid)

@xxj2016

xxj2016 commented Nov 6, 2018

Copy link
Copy Markdown

When is Angular coming next?

@lock

lock Bot commented Nov 6, 2019

Copy link
Copy Markdown

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.

@lock lock Bot locked and limited conversation to collaborators Nov 6, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

6 participants