Question

我如何以编程方式检查Angular中单击按钮时的单选按钮？

我有一个类似的按钮：

<button type="button" class="btn btn-block btn-dark">
  Consegna adesso
</button>

和两个单选按钮，例如：

        <div class="form-check">
          <input
            class="form-check-input"
            type="radio"
            name="radioQuando"
            id="radioOra"
            value="ora"
            checked
          />
          <label class="form-check-label" for="radioOra" ngModel>
            Ora <span class="text-muted">(Arrivo tra 20-40 min)</span>
          </label>
        </div>
        <div class="form-check">
          <input
            class="form-check-input"
            type="radio"
            name="radioQuando"
            id="radioProgramma"
            value="programma"
            (click)="open(programma)"
          />
          <label class="form-check-label" for="radioProgramma">
            Programma
          </label>
        </div>

按下按钮后，如何检查收音机#radioOra？

Answer 1

您可以在按钮上添加点击事件

<button type="button" (click)="onClick(true)" class="btn btn-block btn-dark">
   Consegna adesso
</button>

组件

checked = false

onClick(val) {
 this.checked = val
}

在模板中

<input
        class="form-check-input"
        type="radio"
        name="radioQuando"
        id="radioOra"
        value="ora"
        [checked]="checked" // notice checked here
      />

要点击radioProgramma广播按钮后重新检查按钮

<input
        class="form-check-input"
        type="radio"
        name="radioQuando"
        id="radioProgramma"
        value="programma"
        (click)="onClicked(false)"
      />

如果您正在使用反应形式，则可以在radioOra具有值的情况下设置检查值。

工作DEMO

希望这可以解决您的问题

如何在Angular中单击按钮时检查单选按钮？

1 个答案: