Angular 8单选对错

Question

因为我已经像下面这样使用了这个单选按钮。

    <form [formGroup]="LocationModel.FormCommonGroup">
    <div class="form-group row m-b-10">
            <div class="col-2"></div>
            <div class="col-2 m-p-left">
              <div class="radio radio-css m-l-10">
                <input type="radio" name="radio_css" id="cssRadio1" [(checked)]="LocationModel.EIN" (change)="LocationModel.EIN = !LocationModel.EIN">
                <label for="cssRadio1" class="l_height">EIN</label>                      
              </div>                                                                     
            </div>                                                                       
            <div class="col">                                                            
              <div class="radio radio-css">                                              
                <input type="radio" name="radio_css" id="cssRadio2" [(checked)]="LocationModel.SSN" (change)="LocationModel.SSN = !LocationModel.SSN">
                <label for="cssRadio2" class="l_height">SSN</label>
              </div>
            </div>
          </div>
     <div class="form-group row m-b-10">
        <div class="col-md-4 offset-md-2">
          <input class="btn btn-sm btn-primary m-r-5" (click)="Add()" type=button value="Add Location" />
          <a [routerLink]="['/Locations']" class="btn btn-sm btn-default">Cancel</a>
        </div>
      </div>
    </form>

现在，当我尝试单击 <input class="btn btn-sm btn-primary m-r-5" (click)="Add()" type=button value="Add Location" /> 按钮时，它会显示 true false of EIN or SSN 如果单击一次，如果再次单击对面，则它会在两边都显示 true。这是下面的示例 console.log().

Location
EIN: true
SSN: true

因为我需要 true 和 false 如果点击任何人并多次点击 EIN[= 的对立面35=] 或 SSN.

Answer 1

尝试这种方式可能会有帮助。
在 Html 文件中，将 [(checked)]="LocationModel.EIN" (change)="LocationModel.EIN = !LocationModel.EIN" 替换为 [(ngModel)]="EINSSN" value="EIN"，另一个也如下所示。

<div class="col-2 m-p-left">
          <div class="radio radio-css m-l-10">
            <input type="radio" name="radio_css" id="cssRadio1" [(ngModel)]="EINSSN" value="EIN" [ngModelOptions]="{standalone: true}">
            <label for="cssRadio1" class="l_height">EIN</label>
          </div>
        </div>
        <div class="col">
          <div class="radio radio-css">
            <input type="radio" name="radio_css" id="cssRadio2" [(ngModel)]="EINSSN" value="SSN" [ngModelOptions]="{standalone: true}">
            <label for="cssRadio2" class="l_height">SSN</label>
          </div>
        </div>

然后在您的 ts 文件 class 添加这个 EINSSN:any，然后点击 Add()函数在你的添加函数中写这样的东西。

this.LocationModel.EIN = this.EINSSN == "EIN" ? true : false;
this.LocationModel.SSN = this.EINSSN == "SSN" ? true : false;

Angular 8单选对错

Angular 8 Radio true false

radio-button

typescript

angular

angular8