ng-选择具有异步搜索的添加新选项

Question

我在软件中多次使用[@ng-select/ng-select][1]组件。它运行良好，它在用户键入时通过后端方法进行搜索并显示结果以供选择。

现在我想让用户创建不在列表中的新项目。如何使用异步列表执行此操作？ productNames是一个Observable.

<ng-select [name]="'productname'+index$" [items]="productNames | async"
        [attr.id]="'productname'+index$" 
        [(ngModel)]="detail.productNameNew" 
        [typeahead]="productNameInput" 
        (change)="productNameChanged($event, detail)"
        (keydown)="productNameKeyPress($event, detail)"
        [disabled]="currentSuggestion.acceptUser === null ? null : true"
        [clearable]="false">
    <ng-template ng-label-tmp let-item="item">
        {{item.productName}}
    </ng-template>
    <ng-template ng-option-tmp let-item="item">
        <div class="noproduct-item">
                <div class="noproduct-head">
                    <div class="productname">{{item.productName}}</div>
                    <div class="description">{{item.description}}</div>
                </div>
                <div class="noproduct-details">
                <div class="headid">
                    <span class='glyphicon glyphicon-send'></span>
                    {{item.suggestionHeadId}}
                </div>
                <div class="createduser">
                    <span class='glyphicon glyphicon-user'></span>
                    {{item.createUser?.name}}
                </div>
                <div class="createddate">
                    <span class='glyphicon glyphicon-calendar'></span>
                    {{item.createDate | date: 'yyyy.MM.dd.'}}
                </div>
            </div>
        </div>
    </ng-template>
</ng-select>                   

Answer 1

添加第二个可观察量以捕获用户添加的产品，然后使用 combineLatest 合并它们。 订阅组合列表将生成一个新列表，您可以在 ng-select 中使用。https://stackblitz.com/edit/angular-rxjs-combinelatest