Question

以下是我的模特：

dataModel: {
  company_size: any[],
  company_type: any[],
  employment_status: any[],
  english_knowledge: any[],
  experience_years: any[],
}

selectedDataModel: {
  company_size: any,
  company_type: any,
  employment_status: any,
  english_knowledge: any,
  experience_years: any,
}

这是我的模板：

<ng-container *ngFor="let dm of dataModel | keys">
  <select *ngIf="dataModel[dm.key].values" [(ngModel)]="selectedDataModel[dm.key]" data-live-search="true">
    <option selected hidden>Choose Item</option>
    <option *ngFor="let obj of dataModel[dm.key].values" [id]="obj.id">
      {{obj.value}}
    </option>
  </select>
</ng-container>

问题：当我添加ngModel选择<option selected hidden>Choose Item</option>消失时（显示空字段而不是“选择项目”）

我甚至试过这个：

this.selectedDataModel = {
  company_size: -1,
  company_type: -1,
  employment_status: -1,
  english_knowledge: -1,
  experience_years: -1,
  highest_management_level: -1,
  industry: -1,
  industry_activity: -1,
  is_manager: -1,
  is_position_changed: -1,
  job_title: -1,
  job_function: -1,
  work_province: -1,
}

和

<option id="-1" selected hidden>Choose Item</option>

但它还没有发挥作用。

有没有解决方案？

Answer 1

实施＆＃34;选择项目＆＃34;的一种方法选择列表中的选项是使用值undefined定义隐藏（或禁用）的第一个选项，并在选择后使用*ngIf将其删除（请参阅this stackblitz）。删除该选项在隐藏属性实际上不隐藏选项的浏览器中很有用（例如IE11）。

<select [(ngModel)]="selectedDataModel[dm.key]" ...>
  <option [value]="undefined" *ngIf="!selectedDataModel[dm.key]" hidden>Choose an item</option>
  <option *ngFor="let obj of dataModel[dm.key].values" [value]="obj.id">{{obj.value}}</option>
</select>

Answer 2

一个简单的例子，考虑选项=＆＃34;＆＃34;或选项= 0，但不是null或未定义

option=""

<select [(ngModel)]="option" >
    <option value="" hidden>Select one</option>
    <option value="1">Uno</option>
    <option value="2">dos</option>
</select>

或

option:number=0 

<select [(ngModel)]="option" >
    <option value="0" hidden>Select one</option>
    <option value="1">Uno</option>
    <option value="2">dos</option>
</select>

Answer 3

我认为问题在于使用[id]。而不是[id]="obj.id"，请使用此[value]="obj.id"。

Angular不显示“selected hidden”选择选项

3 个答案: