import { Component } from '@angular/core' ; import { QueryParamBuilder , QueryParamGroup } from '@ngqp/core' ; declare const require ; @ Component ( { selector : 'demo-combine-with-example' , templateUrl : './combine-with-example.component.html' , } ) export class CombineWithExampleComponent { public paramGroup : QueryParamGroup ; public fruits : string [ ] = [ 'Apple' , 'Banana' , 'Strawberry' , 'Raspberry' , 'Mango' , 'Passion Fruit' , 'Orange' ] ; public markup = require ( '!raw-loader!./combine-with-example.component.html' ) . default ; public typescript = require ( '!raw-loader!./combine-with-example.component.ts' ) . default ; constructor ( private qpb ) { this . paramGroup = qpb . group ( { textInput : qpb . stringParam ( 'q' , { combineWith : ( value ) => { if ( ! this . fruits . includes ( value ) ) { return null ; } return { 'fruit' : value } ; } , } ) , selectedFruit : qpb . stringParam ( 'fruit' ) , } ) ; } }