如何根据使用角度在html中选择的单选按钮获取布尔值

Question

我已经创建了两个单选按钮，如 Order 和 Cart，如下所示，我只想获得 TRUE（如果选中单选按钮，并且默认情况下选中 Order 按钮），如果未在 app 中选中，则返回 FALSE。 Angular JS 中的 component.ts 文件。

app.component.html

<div class="container">
    <form>
      <label class="radio-inline">
        <input type="radio" name="optradio" checked id="place_Oreder">Order
      </label>
      <label class="radio-inline">
        <input type="radio" name="optradio" id="add_cart">Cart
      </label>
    </form>
  </div>

我刚刚编写了以下代码，如果两个按钮上都有 onclick，则布尔值将发生变化：

isSelectedMSM:boolean=false;
isSelectedLive:boolean=false;

$(document).ready(function(){
  $("#place_Oreder").click(function(){
    this.isSelectedOrder=true;
  });
});

$(document).ready(function(){
  $("#add_cart").click(function(){
    this.isSelectedcart=true;
  });
});

我不确定如何根据用户选择的单选按钮在 app.components 文件中打印 TRUE 或 FALSE，因为我需要放置 if 条件并调用适当的服务来调用。

有人可以帮助我实现这一目标吗？我只是用谷歌搜索，但我没有找到合适的资源来实现它。如果有人分享您的经验来解决这个问题，那将非常有帮助。

更新：

我不确定上面的代码是否有效。但是有人可以指导我如何以更好的方式实现这一目标。

Answer 1

一个简单的click 事件就可以解决问题

<label class="radio-inline">
      <input type="radio" name="optradio" checked id="place_Oreder" (click)="onClick('order')">Order
</label>
<label class="radio-inline">
      <input type="radio" name="optradio" id="add_cart" (click)="onClick('cart')">Cart
</label>

comp.ts

onClick(item) {
    if(item == 'order')
       this.isSelectedOrder = true;
    else if(item == 'cart')
       this.isSelectedCart = true;
}

Answer 2

您可以为此使用ngForm，将 ref 传递给函数和组件，根据需要获取值。

Demo（检查控制台。）

HTML

<div class="container">
    <form #myForm="ngForm" (submit)="submitForm(myForm)">
        <label class="radio-inline">
        <input ngModel type="radio" name="optradio" checked value="true" id="place_Oreder">Order
      </label>
        <label class="radio-inline">
        <input ngModel type="radio" name="optradio" value="false">Cart
      </label>
        <button type="submit">Submit</button>
    </form>
</div>

组件

submitForm(form: NgForm) {
    console.log(form.value);
  }