Primeng p-dropdown Выполняется ли фильтрация по имени группы? - PullRequest
Новая
       4

Primeng p-dropdown Выполняется ли фильтрация по имени группы?

1 голос
/ 28 января 2020

Я хочу фильтровать по имени группы, используя коды на странице PrimeNG. 

<h3>Group</h3>
<p-dropdown [options]="groupedCars" [(ngModel)]="selectedCar3" placeholder="Select a Car" [group]="true" filter="true" filterBy="label,value">
    <ng-template let-group pTemplate="group">
        <img src="assets/showcase/images/demo/flag/{{group.value}}" style="width:20px;vertical-align:middle" />
        <span style="margin-left:.25em">{{group.label}}</span>
    </ng-template>
</p-dropdown>
<p>Selected Car: {{selectedCar3 || 'none'}}</p>

Я использовал переменную groupedCars .ts page 

selectedCar3: string;
this.groupedCars = [
            {
                label: 'Germany', value: 'germany.png', 
                items: [
                    {label: 'Audi', value: 'Audi'},
                    {label: 'BMW', value: 'BMW'},
                    {label: 'Mercedes', value: 'Mercedes'}
                ]
            },
            {
                label: 'USA', value: 'usa.png', 
                items: [
                    {label: 'Cadillac', value: 'Cadillac'},
                    {label: 'Ford', value: 'Ford'},
                    {label: 'GMC', value: 'GMC'}
                ]
            },
            {
                label: 'Japan', value: 'japan.png', 
                items: [
                    {label: 'Honda', value: 'Honda'},
                    {label: 'Mazda', value: 'Mazda'},
                    {label: 'Toyota', value: 'Toyota'}
                ]
            }
        ];

Но я хочу фильтровать по меткам группы и ярлыки предметов. Возможно ли это?

1 Ответ

0 голосов
/ 29 января 2020

Вы можете добавить дополнительное значение в свойство filterBy. 

this.groupedCars = [
            {
                label: 'Germany', value: 'germany.png', 
                items: [
                    {label: 'Audi', value: 'Audi', additionalValue: 'germany.png'},
                    {label: 'BMW', value: 'BMW', additionalValue: 'germany.png'},
                    {label: 'Mercedes', value: 'Mercedes', additionalValue: 'germany.png'}
                ]
            }
        ];

, и вы можете заполнить это значение с помощью forEach, 

this.groupedCars.items.forEach( item => {
    item.forEach( childValue => {
       childValue.additionalValue = item.value;
    })
} );

, наконец, в файле HTML; 

filterBy="label,value,additionalValue"
...