Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Chris Sworen
935
combo filtering on parameters, model is id only
posted

I'm on IG/AG 14.

I'm trying to build a pair of combo boxes for Designs which have properties: name, id, fab, proc, eng, etc.

I want to filter on proc and group by fab, where the split is on the boolean "eng".

Since the primary object (scenario) is fairly large already, I only want to store an "id" values array (scenario.designs: string[]).

Is it possible to accomplish this with a single array of Design and how?

Here is how I'm currently presenting it:

			<igx-combo #prodDesignsCombo [data]="scenarioDesigns.prod" displayDensity="compact" displayKey="name" [(ngModel)]="scenarioToCreate.designs.prod" (selectionChanging)="updateSelectedDesigns($event, false)" searchPlaceholder="Search..." groupKey="facility">
				<label igxLabel>PROD Designs</label>
				<igx-prefix><igx-icon>memory</igx-icon></igx-prefix>
				<ng-template igxComboEmpty>
					<span class="empty-class">No Designs Selected...</span>
				</ng-template>
			</igx-combo>
			<igx-combo #prodDesignsCombo [data]="scenarioDesigns.eng" displayDensity="compact" displayKey="name" [(ngModel)]="scenarioToCreate.designs.eng" (selectionChanging)="updateSelectedDesigns($event, true)" searchPlaceholder="Search..." groupKey="facility">
				<label igxLabel>ENG Designs</label>
				<igx-prefix><igx-icon>engineering</igx-icon></igx-prefix>
				<ng-template igxComboEmpty>
					<span class="empty-class">No Designs Selected...</span>
				</ng-template>
			</igx-combo>

This is utilizing split designs in both master list and ngModel. The ngModel is also using a list of object rather than a list of string-ids, as hoped for.

Parents
No Data
Reply
  • 2560
    Offline posted

    Hi Chris,

    Thank you for posting to Infragistics Community!

    I have been looking into your question and I believe this requirement is a matter of data manipulation. As you are probably familiar, the IgxCombo offers the valueKey and displayKey properties to work with object arrays. Apart from that, any other data operations could be achieved by leveraging the Combo API. For instance, you could create an array containing only the string-ids extracted from the complex object array and bind it to the combo, as per the described requirement. Then, on the selectionChanging event, more data about the new selection could be extracted from the original object array, based on the event arguments’ new selection. Still, I am not sure if this would not be more of an overhead than simply using the valueKey and displayKey properties.

    Additionally, it is possible that I am not completely understanding your scenario. Since there are two combos is it related to cascade selection? It would be appreciated to please elaborate a bit more on what a “split design” means. Providing a sample object of the mentioned data type would also be helpful, as the “name, id, fab, proc, eng, etc.” properties are mentioned, however, the html snippet shows other property names such as groupKey=”facility”, [data]="scenarioDesings.prod”, etc. Ideally, please, fork and modify any of our Combo documentation StackBlitz demos with any relevant code, additional description and comments. Thank you in advance.

    Best regards,
    Bozhidara Pachilova
    Associate Software Developer

Children