Hi Chris,

Thank you for posting to Infragistics Community!

I have been looking into your question and what I can say is that you are on the right track by choosing the igx-combo for the purposes of searching among items and allowing multi-selection.

Regarding searching for items in the combo, what I can say is that this happens based on the valueKey property. To address your question about searching based on a custom “composite key”, the most straightforward suggestion would be to create such a field for your data items and assign it as the valueKey. The display values, on the other hand, could be either the same property, or anything custom defined in the item template. Also, it could be another additional property defined by you.

One thing to keep in mind, though, is in case the valueKey values contain the “ for ” string (or whatever is in that predefined template), then typing “ for “ in the search input will filter all items.

The two points to consider about the latter is that with the item template approach, since the displayKey would not be defined, the valueKey will be used to display the selected values in the combo input.

Alternatively, if there is a property created specifically to be used as the displayKey, then, this will be displayed in the input.

I went ahead and created a sample demonstrating these suggestions for some test data. Having in mind that the default search condition is “contains”, here is the result – it displays results both based on the “name” and “country” values.

I believe that this would be a more straightforward approach, rather than trying to override the default search behavior for instance. Of course, this also relies on the fact that the *name*-*country* key is unique.

Finally, if there is a consideration regarding the fact that the slectionChanging event’s arguments will contain different ids than the original. I believe we discussed how the selected values could be mapped in this other forum thread I have assisted you with not long ago. The sample also illustrates a similar approach, if this is also needed.

    <igx-combo
      class="combo"
      #withValueKey
      [data]="cities"
      valueKey="compositeKey"
      displayKey="displayString"
      groupKey="country"
      [(ngModel)]="selectedValueKey"
      (selectionChanging)="handleSelectionChanging($event)"
    >

  private addCitiesCompositeKey() {
    CITIES.forEach((c: ICity) => {
      let newCityWithCompositeKey: any = Object.assign({}, c);
      newCityWithCompositeKey.compositeKey = c.name + ' ' + c.country;
      newCityWithCompositeKey.displayString =
        c.name + ' of country ' + c.country;
      this.cities.push(newCityWithCompositeKey);
    });
  }

  public handleSelectionChanging(ev: any): void {
    this.selectedRealIDs = this.cities
      .filter((c) => ev.newSelection.indexOf(c.compositeKey) !== -1)
      .map((c) => c.id);
    console.log(this.selectedRealIDs);
  }

export interface ICity {
  name: string;
  id: string;
  country: string;
}

export interface ICityComposite extends ICity {
  compositeKey: string;
  displayString: string;
}

If you need any further assistance on the matter, please, let me know.

Best regards,
Bozhidara Pachilova
Associate Software Developer