从选择角度 4 中删除选项答案

【问题标题】：Remove options from select angular 4从选择角度 4 中删除选项
【发布时间】：2018-01-10 21:22:24
【问题描述】：

我在一个场景中需要帮助，而场景在一个页面上，我有 4 个选择输入，每个输入都有它们的源，比如对象中的 4 个项目副本。

例如

<ion-select (ionChange)="onChange($event,i)" class="select-bx" placeholder="Select Security Question" [(ngModel)]="objQuestListModel[i].selQuestionId">
    <ion-option *ngFor="let items of objQuestList[i]" value="{{items.QuestionId}}">{{items.QuestionText}}</ion-option>
  </ion-select>

所以我想从每个下拉列表中删除所有选定的项目，但保留选定下拉列表的选定项目。

例如，在下拉列表 1 中，如果我选择了 A 选项，则应从所有其余下拉列表中将其删除在下拉列表 2 中，如果我选择了选项 B，那么它应该从下拉列表 1 中删除。我正在使用 angular 4 和 cordova。

请帮帮我。

问候阿尼尔库马尔

【问题讨论】：

stackoverflow.com/questions/42372560/…

标签： angular cordova ionic-framework

【解决方案1】：

我不知道离子，所以我会使用角度语法。

在您的组件打字稿文件中，您应该执行以下操作：

private selectedOptions:number[] = [];

private onChangeSelectBox(event:any){
    let value:number = event.target.value;
    if(this.selectedOptions.indexOf(value) == -1){
        this.selectedOptions.push(value);
    }
}


private showOption(optionId:number):boolean{
    return this.selectedOptions.indexOf(optionId) == -1;
}

在你的 html 文件中：

<select (change)="onChangeSelectBox($event)">
      <template ngFor let-item [ngForOf]="yourItemsCollection">
         <option *ngIf="showOption(item.id)" value="{{item.id}}">
            {{item.name}}
         </option>
      </template>
<select>

【讨论】：

"let-" 仅支持 ng-template 元素。