I am struggling with filtering a dataView with a dropdown menu using NgPrime. It's specifically the dropdown that's giving me a hard time. In fact, I have a working pInputText that filters the dataView for the same thing which tells me it's my dropdown that isn't working, not the dataView in general.
dataView definition:
<p-dataView #dv [value]="things" layout="grid" filterBy="x ,y ,z" [sortField]="sortField" [sortOrder]="sortOrder" [paginator]="true" [rows]="20" paginatorPosition="both">
Dropdown that works for sorting:
<p-dropdown [options]="sortOptions" [(ngModel)]="sortKey" [placeholder]="'something" (onChange)="onSortChange($event)" [style]="{'min-width':'140px'}"></p-dropdown>
pInputText that works for filtering:
<input type="search" pInputText placeholder="Filter by x" (input)="dv.filter($event.target.value)">
Dropdown that is not working:
<p-dropdown [options]="units" optionLabel="label"
(onChange)="dv.filter($event.target.value)" placeholder="Unit" styleClass="ui-column-filter" [showClear]="true">
<ng-template let-option pTemplate="item">
<span>{{option.value.label}}</span>
</ng-template>
</p-dropdown>
I'm receiving ERROR TypeError: $event.target is undefined. It's confusing to me because the very same syntax works when it's a text input, but not the dropdown.