How To Search A Airport Through Iata Codes.not By The Names

Working on a flight booking website. I want to search an Airport through IATA codes.Not the Names. When I type LON it should display London on the top because the IATA code is LON

Solution 1:

To do this, your data model will have to be modified to support this. You could-pre-process in JavaScript using splits, regex, etc, but that's not really an ideal situation, and not something you want to do client-side.

This solution will work if you can modify your model to have separate name and code properties:

Given a model like this: { 'name': 'Boston', 'code': 'BOS' }, and having an array of aiports:

$scope.airports = [
      { 'name': 'Boston', 'code': 'BOS' },
      { 'name': 'London, United Kingdom', 'code': 'LON'},
      { 'name': 'New London, CT', 'code': 'GON'}
    ]

You can create a typeahead like so:

<inputtype="text"
       ng-model="selected1"
       uib-typeahead="airport as airport.name + ' (' + airport.code + ')' for airport in airports | filter:{code:$viewValue} | limitTo:10"class="form-control" />

I have create a Demo of this with three variations, one with the display as you have it (Name with code in parens), and one with just the code, and one with just the name.

https://plnkr.co/edit/dLv4fTbqxG8W5legjnXr?p=preview