Question

我有选择框，我想在选择第一个选项时禁用按钮。

<select>
  <option value="0">first option</option>
  <option value="1">second option</option>
  <option value="3">third option</option>
</select>

<button type="submit" class="primary">Submit</button>

Answer 1

您不必为此编写.ts代码。

试试这个

 <select #selectoption>
      <option value="0">first option</option>
      <option value="1">second option</option>
      <option value="3">third option</option>
  </select>

<button type="submit" class="primary" [disabled]="selectoption.value =='0'">Submit</button>

Answer 2

以下代码将在选择第一个选项

时禁用提交按钮

在 Html 文件

中

execution

TS 文件

execution.setVariable("testVar", true);

供参考使用以下link来测试代码

Answer 3

在您的打字稿中初始化Select模型，如

Select: any = '-1';

现在你应该在你的html中这样做：

<select [(ngModel)]="Select">
  <option value="-1">--Select--</option>
  <option value="0">first option</option>
  <option value="1">second option</option>
  <option value="3">third option</option>
</select>

<button type="submit" class="primary" [disabled]="Select==0">Submit</button>

以下是工作演示：First Option Disabled

希望这对你有用!!!

Answer 4

好的，

提交

比触发器：

<select (change)="checkValidation($event.target.value)">
  <option value="0">first option</option>
  <option value="1">second option</option>
  <option value="3">third option</option>
</select>

功能：

 isValid: boolean = false;

 checkValidation(value:any):void{
  console.log(value);
   if(value == 0){
     this.isValid=false;
   }
   else{
     this.isValid=true;
   }
 }

您可以找到一个有效的示例here

无论如何，这是一个不使用2路绑定的教学示例，可能不是最优解决方案

角度4选择框和禁用按钮

4 个答案: