JSPM

public showPicker() {
    page.getViewById('myfilter').show();
}

public itemTapped(args) {
    alert(args.selectedItem + ' was tapped!')
}

public cancelFilterableList() {
    // this gets called if the user cancels the modal. 
}

let API_KEY = "__YOUR_GOOGLE_API_KEY";

private filterableListpicker: FilterableListpicker;
private page: Page;
constructor(page: Page) {
    super();
    this.page = page;
    // Get filterableListpicker instance
    this.filterableListpicker = (<any>this.page.getViewById('myfilter'));
    MyModel = this;
}

public showPickerAsAutocomplete() {
    // IMPORTANT : Set `isAutocomplete` to true to enable `textChange` listener
    this.filterableListpicker.isAutocomplete = true;
    this.filterableListpicker.show(frame.topmost());
    
    this.filterableListpicker.autocomplete((data) => {
        let url = placesApiUrl + "?input=" + data.value + "&language=fr_FR&key=" + API_KEY;
        http.getJSON<Predictions>(url).then((res) => {
            //console.dir(res)
            const airportsCollection = res.predictions;
            const items = [];
            for (let i = 0; i < airportsCollection.length; i++) {
                items.push({
                    title: airportsCollection[i].description,
                    description: "",
                    source: airportsCollection[i]
                });
                
            }
            this.set("listitems", items)
        }).catch((err) => {
            const message = 'Error fetching remote data from ' + url + ': ' + err.message;
            console.log(message);
            alert(message);
        });
    });
}

// app.component.ts
import {registerElement} from "@nativescript/angular";
import {FilterableListpicker} from '@nstudio/nativescript-filterable-listpicker';
registerElement("FilterableListpicker", () => FilterableListpicker);

@ViewChild('myfilter') myfilter: ElementRef;

cancelFilterableList() {
    console.log('canceled');
}

itemTapped(args) {
    alert(args.selectedItem)
}

showPicker() {
    this.myfilter.nativeElement.show();
}

@ViewChild('myContainer') myContainer: ElementRef;

public function showPicker() {
  this.myfilter.nativeElement.show(this.myContainer.nativeElement);
}

public listitems = [
    {
        "image": "https://lh3.googleusercontent.com/gN6iBKP1b2GTXZZoCxhyXiYIAh8QJ_8xzlhEK6csyDadA4GdkEdIEy9Bc8s5jozt1g=w300",
        "title": "Brown Bear",
        "description": "Brown bear brown bear, what do you see?"
    },
    {
        "image": "http://icons.veryicon.com/png/Flag/Rounded%20World%20Flags/Indonesia%20Flag.png",
        "title": "Red Bird"
    },
    {
        "title": "Purple Cat",
        "description": "Why are we teaching kids there are purple cats?"
    }
];