Question

我根据前一个下拉列表的输入值填充下拉列表，其中我一次一个地填充数组整数然后输入值我正在过滤动态下拉列表。

但是，一旦过滤按预期工作，但在更改下拉输入时，动态数据不会再次加载。

我甚至使用变化检测器参考，但没有发生变化。

以下是我的代码：

    @ViewChild('select1') select1: any; // reference variable for select

    getTheProductType(){
    var productTypeId = this.select1.value;
    this.productsAfterChangeEvent = this.allProducts.filter(p => p.typeId == productTypeId);
    this.changeDetectorRef.detectChanges();
    }

HTML：

    <select #select1 (change)="getTheProductType()">
      <option *ngFor="let p of checkedOutProducts">{{p.name}}</option>
    </select>

    <select #select2>
       <option>Pick a product...</option>
       <option *ngFor="let p of productsAfterChangeEvent">{{p.name}}
       </option>
   </select>

如何在angular2中执行此操作。

如果我只在第一次选择select1下拉列表中的数据时更改select1中的值，则无法加载数据我在第二次下拉列表中获取过滤后的数据但是当我再次更改数据时，没有发生任何变化。

任何帮助？

任何人都曾经这样做过吗？

提前谢谢。

Answer 1

可能没有触发更改事件，因为您没有在选项上设置值属性？

您可以尝试这样的事情（假设p.typeId是唯一的）：

<option *ngFor="let p of checkedOutProducts" [value]="p.typeId">{{p.name}}</option>

Answer 2

当我使用materializecss时，它对select元素的动态数据有初始化问题。因此，如果有人使用materializecss，则需要添加属性 [materializeSelectOptions] =“dynamicDataArray”以重新初始化select元素。希望这有助于将来的任何人。

Angular2中的动态DropDown未填充数据

2 个答案: