angular - Primeng multiselect 显示选中的值，用特殊字符分隔而不是默认的逗号

Question

我正在使用 Angular 为 7 的 primeng。默认情况下，多选组件显示以逗号分隔的选定值。我需要它来显示由 # 分隔的值。

        <p-multiSelect formControlName="selectedLayers"
                       [options]="layerList"
                       [id]="'selectedLayers'"
                       [selectedItemsLabel]="'{0} layers selected'">
        </p-multiSelect>

        ngOnInit(): void {
            this.groupLayerForm = this.formBuilder.group({
            selectedLayers: [[], [
                ArrayValidator.minLengthArray(1)
            ]]
        }

Answer 1

您可以将 primeng multiSelect 的模板选项与 pTemplate="selectedItems" 一起使用:

   <p-multiSelect formControlName="selectedLayers"
                       [options]="layerList"
                       [id]="'selectedLayers'"
                       [selectedItemsLabel]="'{0} layers selected'">
            <ng-template let-selectedLayers pTemplate="selectedItems">
               <ng-container *ngFor="let selectedLayer of selectedLayers;">{{selectedLayer}}#
               </ng-container>
            </ng-template>
        </p-multiSelect>

在模板部分的官方 primeng 页面中有更多信息: https://www.primefaces.org/primeng/#/multiselect