选择框的异步加载选项 - 不显示选择

Question

我为selectbox创建了一个Angular 2组件，用于异步加载选项：

HTML

<select (click)="onClickHandler()" [(ngModel)]="value" [class]="'form-control'">
    <ng-container *ngIf="options">
        <ng-container *ngFor="let option of options">
            <ng-container *ngTemplateOutlet="template; context: {$implicit: option}">
            </ng-container>
        </ng-container>
    </ng-container>
</select>

JS

function onClickHandler() {
    if (this.enableCache && this.options) {
        return;
    }

    this.http.get(...).subscribe(response => this.options = response['value']);

    // options contains this : [
    //     {value: 'Not_started' },
    //     { Value: 'New' },
    //     { Value: 'In Progress' },
    //     { Value: 'Done' }
    // ]
}

我在打开selectbox时遇到问题。当我点击选择时，不要打开选项，这是结果： apple developer blog

当我想显示所有选项时，我必须关闭选择并再次打开。 我注意到，当我删除class="form-control"时，它正常工作。 什么时候可以出问题？谢谢你的建议。