我正在尝试使用Angular 6加载页面时选中默认复选框

Question

我正在尝试在页面加载时选中复选框默认值。这是我的 组件。

var user = ViewprojectComponent.featuresList1;
this.rules_id = user[0];
for(let i = 0; i <= this.rules_id.length; i++)
{
  var checkedOn1 = this.rules_id[i];
  this.Rules = checkedOn1.rule_id;
  this.checkedOn.push(this.Rules)
}

HTML是

<ng-template pTemplate="body" let-rule *ngFor="let feature of checkedOn">
  <tr>{{feature}}
    <td><input type="checkbox" [checked]="feature == rule.rule_id " (change)="selectRule($event, rule.rule_id)"></td>
    <td>{{rule.rule_name}}</td>
    <td><button (click)="viewRule(rule.rule_id)" class="mini ui green button">
                    View </button></td>
  </tr>
</ng-template>

Answer 1

您可以将复选框的默认值声明为true。

<input type="checkbox" [(ngModel)]="theCheckbox"  data-md-icheck (change)="toggleVisibility($event)"/>
    Checkbox is <span *ngIf="marked">checked</span><span *ngIf="!marked">unchecked</span>

  <span class="checkmark"></span>

export class AppComponent  {

  marked = true;
  theCheckbox = true;
  constructor() {
  }
  
  toggleVisibility(e){
    this.marked= e.target.checked;
  }