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

使用＆＃34; [选中]＆＃34;输入属性或属性。使用布尔值检查取消选中复选框。

在模板中：

    <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>

至少这是我按钮点击的方式，你不能有两个单独的（点击）。我在自己的个人网站上用它来取得成功。

Angular 5选择并取消选中一个复选框

2 个答案: