Как всегда отображать заполнитель ng-select? - PullRequest
1 голос
/ 24 февраля 2020

Я использую ng-select в моем приложении angular и у меня довольно необычный вариант использования. Мне нужно всегда отображать заполнитель, даже если выбран вариант. При использовании текущего кода заполнитель заменяется значением выбранного параметра:

<ng-select
[(ngModel)]="selectedApplication"
class="application-switcher"
[attr.data-sel-id]="selId"
[clearable]="false"
appendTo="body"
[searchable]="false"
placeholder="{{ 'APP_TITLE' | translate }}"
[virtualScroll]="virtualScroll"
[markFirst]="false">
<ng-option *ngFor="let application of applicationList" [value]="application"
    ><div>
        {{ getApplicationName(application) }}
    </div>
</ng-option>

1 Ответ

0 голосов
/ 24 февраля 2020

Если вы хотите иметь фиксированный заполнитель внутри выделенной области элементов, вы можете сделать это следующим образом:

Пользовательский шаблон для всех выбранных элементов, используя ng-multi-label-tmp

<ng-select
    [items]="githubUsers$ | async"
    [multiple]="true"
    bindLabel="login"
    bindValue="login"
    placeholder="Select items"
    [(ngModel)]="selectedUsers">
    <ng-template ng-multi-label-tmp let-items="items" >
        <div class="ng-value" >
            <span class="ng-value-label">Items Selected: </span>
        </div>
        <div class="ng-value" *ngFor="let item of items ">
            <span class="ng-value-label"> {{item.login}}</span>
            <span class="ng-value-icon right" (click)="clear(item)" aria-hidden="true">×</span>
        </div>

    </ng-template>
</ng-select>

Измените файл html в этот стек , чтобы увидеть результат:

enter image description here

...