角度4：檢查另一個單選按鈕后，單選按鈕值消失

Question

我有3個單選按鈕，用於從API排序不同的數據。 如果我按下另一個單選按鈕，則每個單選按鈕上的單選按鈕值都會消失，如下所示： 和 。 我嘗試使用屬性綁定[value]，但是導致錯誤。

TS：

  // Global inputvalues for Radiobuttons
  @Input() all: string; image: string; video: string; true: boolean; false: boolean;


  // Button-event payload
  @Output() mediaButtonSelectionChange: EventEmitter<string> = new EventEmitter<string>();
  @Output() licenseButtonSelectionChange: EventEmitter<string> = new EventEmitter<string>();
  @Output() verifiedButtinSelectionChange: EventEmitter<string> = new EventEmitter<string>();

  sortMedia() {
    this.page = 0;
    this.hitsArray = [];
    this.mediaButtonSelectionChange.emit(this.mediaRadio);
    this.mediaType = this.mediaRadio;
    this.getStories(this.page, this.hits, this.feed, this.mediaType, this.query, this.verifiedType, this.licenseType, this.startDate, this.endDate);

  }

（由於API調用，sortMedia（）函數對每個單選按鈕排序都有一個）。

HTML：

<div class="container-fluid filter-btn">
  <button class="btn btn-sm gay-flame-btn-light filter-btn dropdown-toggle" type="button dropdown-toggle" data-toggle="dropdown"
    aria-haspopup="true" aria-expanded="false">Media type
    <span *ngIf="mediaType === 'all'" style="color:red;">(All)</span>
    <span *ngIf="mediaType === 'image'" style="color:red;">(Images)</span>
    <span *ngIf="mediaType === 'video'" style="color:red;">(Videos)</span>
  </button>
  <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
    <div class="radio-group">
      <div class="checkbox-forms gay-flame-forms form-group radio">
        <label class="form-check-label">
          <input type="radio" value='all' [(ngModel)]="mediaRadio" (change)="sortMedia()">
          <i aria-hidden="true" [class.active-check]="'all' === 'all'" class="fa fa-circle"></i> All</label>
        <label class="form-check-label">
          <input type="radio" value="image" [(ngModel)]="mediaRadio" (change)="sortMedia()">
          <i aria-hidden="true" class="fa fa-circle"></i> Images</label>
        <label class="form-check-label">
          <input type="radio" value="video" [(ngModel)]="mediaRadio" (change)="sortMedia()">
          <i aria-hidden="true" class="fa fa-circle"></i> Videos</label>
      </div>
    </div>
  </div>
</div>

（此部分的每個單選按鈕也有3個單獨的部分）。

如果按下另一個按鈕，如何保持每個按鈕的單選按鈕值？

Answer 1

正如@AnteJablan提供的那樣，解決方案只是（有點怪異）為HTML添加了一個name屬性，如下所示：

<input type="radio" name="verification" value="false" [(ngModel)]="verifiedRadio" (change)="sortVerification()">

謝謝安特！