Nativescript Multi Select
This plugin is cloned from nativescript-multi-select .
Nativescript Multi Select is a popup dialog which provides multi selection, search through list and return the selected items.
ns plugin add @elgibor-solution/nativescript-multiselect
Angular
import { Component , OnInit , NgZone } from "@angular/core" ;
import { MultiSelect , AShowType } from '@elgibor-solution/nativescript-multiselect' ;
@Component ( {
// ...
} )
export class SomeComponent implements OnInit {
private _MSelect : MultiSelect ;
private predefinedItems : Array < any > ;
public selectedItems : Array < any > ;
constructor ( private zone : NgZone ) {
this . _MSelect = new MultiSelect ( ) ;
this . predefinedItems = [ "moi-a" , "moi-b" ] ;
}
ngOnInit ( ) : void {
}
onSelectTapped ( ) : void {
const options : MSOption = {
title : "Please Select" ,
selectedItems : this . predefinedItems ,
items : [
{ name : "A" , value : "moi-a" } ,
{ name : "B" , value : "moi-b" } ,
{ name : "C" , value : "moi-c" } ,
{ name : "D" , value : "moi-d" } ,
] ,
bindValue : 'value' ,
displayLabel : 'name' ,
onConfirm : selectedItems => {
this . zone . run ( ( ) => {
this . selectedItems = selectedItems ;
this . predefinedItems = selectedItems ;
console . log ( "SELECTED ITEMS => " , selectedItems ) ;
} )
} ,
onItemSelected : selectedItem => {
console . log ( "SELECTED ITEM => " , selectedItem ) ;
} ,
onCancel : ( ) => {
console . log ( 'CANCEL' ) ;
}
} ;
this . _MSelect . show ( options ) ;
}
}
Property
Type
Description
show(options: MSOption)
() : void
Show Multi Select Dialog
Property
Type
Description
title
string
Dialog Title
confirmButtonText
string
confirm button text optional
cancelButtonText
string
cancel button text optional
selectedItems
Array<any>
predefined items optional
items
Array<any>
items/list that will be display
bindValue
string
the value that will determine the property which will be return when an item is selected optional
displayLabel
string
the value that will determine the property which will be display in the list optional
onConfirm: (selectedItems: Array<any>) => void
Function Callback
callback which fires when the selection has been confirm/done
onItemSelected: (selectedItem: any) => void
Function Callback
callback which fires when an item has been selected optional
onCancel: () => void
Function Callback
callback which fires when the cancel button is tapped optional
MSAndroidOption (for android)
Property
Type
Description
titleSize
number
optional
Property
Type
Description
showType
number
popup view show type, default by AAPopupViewShowTypeFadeIn optional
dismissType
number
popup view dismiss type, default by AAPopupViewDismissTypeFadeOut optional
itemColor
string
item text color optional
Apache License Version 2.0