Angular 5選擇並取消選擇一個復選框

Question

好吧，我有一個ngBootstrap模態的服務條款模態，當我按下按鈕以關閉該按鈕時，我希望關閉模態的動作定義是否選中此復選框，這是html：

  <ng-template #content let-c="close" let-d="dismiss">
  <div class="modal-header">
  <h4 class="modal-title">Terms of service.</h4>
  <button type="button" class="close" aria-label="Close" (click)="d('Cross 
  click')">
  <span aria-hidden="true">&times;</span>
  </button>
  </div>
  <button type="button" class="btn btn-success" (click)="c('Close click'); 
   setAccepted(true)" >I accept.</button>
  </ng-template>

打開模態和復選框的鏈接

<div class="custom-control custom-checkbox">
            <input *ngIf="accepted" type="checkbox" class="custom-
control-input" id="save-info" required>
            <label class="custom-control-label" for="save-info">I have read 
</label><a href="javascript:void(0)" (click)="open(content)"> 
  the terms of service</a>.
</div>

在其下，我有<p>{{accepted}}</p>僅用於測試

和打字稿

accepted: boolean = false;

constructor(private modalService: NgbModal) {}

open(content) {
 this.modalService.open(content);
}

setAccepted(accepted:boolean){
  this.accepted = accepted;
}

我嘗試了[（ngModel）]，* ngIf，ngModel到我的打字稿中接受的布爾值，但似乎沒有任何效果。

Answer 1

使用“ [已檢查]”輸入屬性或屬性。 使用布爾值來選中取消選中該復選框。

在模板中：

    <input [checked]="accepted" type="checkbox" class="custom-
control-input" id="save-info" required>

在TS中：

accepted: Boolean;
accepted = true;   // Or False

Answer 2

嗯，有一條評論...你有...

 <button type="button" 
 class="btn btn-success" 
 (click)="c('Close click')" 
(click)="setAccepted(true)" >I accept.</button>

應該

 <button type="button" class="btn btn-success" 
 (click)="c('Close click');setAccepted(true)" >I accept.</button>

至少這是我為按鈕單擊所做的操作，不能有兩個分開的（單擊）。 我已經在自己的個人網站上成功使用了它。