如何验证两个下拉菜单取决于选择？答案

【问题标题】：how to validate two dropdowns depends upon selection?如何验证两个下拉菜单取决于选择？
【发布时间】：2021-05-27 11:15:47
【问题描述】：

我有两个下拉菜单，第一个下拉菜单 1 到 23 小时，第二个下拉菜单也 1 到 23 小时。如果我选择第一个下拉菜单是 4。第二个下拉菜单高于第一个下拉菜单选择的值。如何做到这一点

【问题讨论】：

分享你的代码
首先感谢您的回复。
第一个下拉列表 1 到 23 个数字。如果我选择第一个下拉列表是任何选定的数字，第二个下拉列表也相同，并且第二个下拉列表自动启用大于第一个值的值。我们可以显示消息，例如请选择最高值。
这样您就可以在第二个下拉菜单中设置第一个下拉菜单的选定值。
你得到我的答案了吗？请至少给出答复

标签： angular10

【解决方案1】：

这是您所关心的解决方案。如果你不使用表格，我已经使用了表格，然后将其删除并进行正常的角度控制。

HTML

<form [formGroup]="form" (ngSubmit)="submit()">
      <div class="form-group">
        <select formControlName="firstDropdown" class="form-control" (change)="firstDropDownChange($event)">
          <option *ngFor="let value of values" [value]="value">
            <span>{{ value }}</span>
          </option>
        </select>
        <select formControlName="secondDropdown" class="form-control" (change)="secondDropDownChange($event)">
          <option *ngFor="let value of values1" [value]="value">
            <span>{{ value }}</span>
          </option>
        </select>
      </div>
      <button class="btn btn-primary" type="submit" [disabled]="!form.valid">
        Submit
      </button>
</form>

values: any = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23];
values1: any = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23];
firstDropdown: any = 1;
secondDropdown: any = 1;
form: FormGroup;

constructor() {
    this.form = new FormGroup({
      firstDropdown: new FormControl(1),
      secondDropdown: new FormControl(1),
    });
}



  firstDropDownChange(event) {
    this.values1 = this.values.filter(
      (data) => parseInt(event.target.value) <= data
    );
    console.log(this.values1);
    this.form.controls['secondDropdown'].setValue(parseInt(this.values1[0]));
  }

  secondDropDownChange(event) {}

  submit() {}

【讨论】：

你得到答案了吗？