Angular4 勾选复选框显示禁用按钮基础问题

Question

能实现效果，但感觉太麻烦了。
有没有简洁高效的方法？
Template:

<label><input icheck type="checkbox" (click)="onCheckAgree()">同意</label>

<button [disabled]="agreectrl">支付</button>

Ts:

public agree = true;
public agreectrl =true;

onCheckAgree(){
 if(this.agee){
  this.agreectrl = false;
console.log('同意')
this.agree = !this.agree;
} else {
  this.agreectrl = true;
console.log('取消了协议')
this.agree = !this.agree;
}
}

Answer 1

直接在HTML里面控制应该就可以吧

<label><input icheck type="checkbox" (click)="onCheckAgree()">同意</label>

<button [disabled]="!agee">支付</button>

Answer 2

用双向数据绑定的原理，ts都不用写：

<label><input icheck type="checkbox" [(ngModel)]="agreectrl">同意</label>
<button [disabled]="agreectrl" >支付</button>