时间戳

首页 > 解决方案 > 下拉框中的下拉列表消失 Angular 5

html - 下拉框中的下拉列表消失 Angular 5

问题描述

我在 Angular 5 中有一个表单，或者当我在下拉列表中选择一个值时，它会显示另一个。

问题是，当我在第一个下拉列表中选择（参见链接）时，值“二”，然后我在下拉列表中选择另一个值，这个值就消失了。

https://stackblitz.com/edit/angular-a4va9u?embed=1&file=src/app/app.component.html

（当我在第一个下拉列表中选择值“第一”并再次选择值“二”时，再次出现）

我做了一些研究，发现了一个与我的问题相对应的有趣链接，但它与 AngularJs 相关，当我将它读到我的问题时它不起作用（此外，我的下拉列表根据下拉列表的值出现上面的列表）AngularJS 选择框选项在选择项目时消失

点击链接其实很简单理解。

如果您对我的问题有解决方案，我就是接受者。

提前感谢您的回答，祝您有美好的一天。

问候， 瓦伦丁

标签： htmlangulartypescript

解决方案

两个下拉菜单都相同formControlName

发生的事情是，当您在第一个下拉列表中选择“两个”选项时，*ngIf="usForm.value.type == 'two'评估结果为true并出现第二个下拉列表。但是，当您在第二个下拉列表中选择任何内容时，因为它具有相同formControlName的值，它会将值更改为type其他值，从而使*ngIf="usForm.value.type == 'two'评估为 false，因此第二个下拉列表消失。

您应该为此选择选项设置不同的 formControlName。sub-type或许像。

<p id="champs" *ngIf="usForm.value.type == 'two'">Appears
      <select formControlName="sub_type" name="consistance">
        <option style="display:none">
        <option [value]="appears.name" *ngFor="let appear of appears">
          {{appear.name}}
        </option>
      </select>
    </p>

推荐阅读