Question

我正在使用Angular 2 + Typescript，我刚刚开始了很短的时间。我想列出一个复选框并检查它们的状态。

与某些购物网站一样，复选框是公司，选择一些并按搜索按钮显示所选公司的产品。

<ul class="companies">
    <li *ngFor="let company of companies">
        <input type="checkbox">{{ companies.name }}
    </li>
</ul>

“companies”是一个取自数据库的数组。每家公司都有一个id和一个名字。 * ngFor将为数组中的每个元素重复li。每个li都包含一个复选框和一个纯文本。

我不能给每个复选框一个id。因此，我不知道如何检查他们的状态。我感谢任何帮助。

Answer 1

如果您使用>，则可以在值状态更改时使用mat-checkbox事件调用方法。这看起来像这样：

@Output() change: EventEmitter<MatCheckboxChange>

然后你需要在ts类中使用<ul class="companies"> <li *ngFor="let company of companies"> <mat-checkbox (change)="onCheckboxStateChange($event, company.id);">{{ companies.name }}</mat-checkbox> </li> </ul>方法来处理check事件。 onCheckboxStateChange(changeEvent: MatCheckboxChange, id: number)有一个属性changeEvent，您可以按如下方式使用：

checked

Angular 2 - 复选框列表 - 如何检查复选框的状态

1 个答案: