Angular6 选中和未选中“打开div”复选框6

component.html

问题描述

我想在选中和取消选中该复选框时切换这两个div（应用程序堆栈条形图）

component.ts

//declare variable for chacked/unchecked

isChecked:boolean = true;

<div class="col-lg-6">
    <div class="form-check position-absolute">
        <input type="checkbox" (change)="isChecked =! isChecked" class="form-check-input" id="exampleCheck1" [checked] = true >
    </div>
    <app-stackbar-chart *ngIf="isChecked" [data]="exp_month_data"></app-stackbar-chart>
    <app-stackbar-chart *ngIf="!isChecked" [data]="exp_data_performance"></app-stackbar-chart>
</div>

组件技术

//declare variable for chacked/unchecked

isChecked:boolean = true;

<div class="col-lg-6">
    <div class="form-check position-absolute">
        <input type="checkbox" (change)="isChecked =! isChecked" class="form-check-input" id="exampleCheck1" [checked] = true >
    </div>
    <app-stackbar-chart *ngIf="isChecked" [data]="exp_month_data"></app-stackbar-chart>
    <app-stackbar-chart *ngIf="!isChecked" [data]="exp_data_performance"></app-stackbar-chart>
</div>

您可以使用*ngIf。类似于*ngIf=“！checked”的内容。我试过了，但不起作用。。你可以请张贴我应该如何实现请参考此链接可能是它的帮助你