解决 Angular 中 ngFor 作用域问题

在使用 Angular 开发过程中，我们常常会遇到一些看似简单但却容易出错的场景。今天，我们来探讨一下如何解决 ngFor 循环中出现的作用域问题，特别是当多个组件共享同一个数据模型时。

问题描述

假设你有一个父组件，其中包含多个子组件。每个子组件内部又包含一个复选框列表，这些复选框都是通过 ngFor 生成的。理想情况下，每个子组件内的复选框应该独立操作，但实际上却会出现一个问题：当你勾选其中一个子组件内的复选框时，其他子组件中的相同位置的复选框也会被勾选。这是因为这些子组件共享了同一个数据模型。

代码示例

以下是典型的父子组件结构：

父组件模板：

<divclass="bloco-bilhete"id