我有一个父组件:父列表包含两个子组件(第一个子列表,第二个子列表)
在第二个子列表组件中:我有一个 mat 表,它接收要显示为输入数据的数据,因此我使用 Mat 表数据源的实例在 ng OnChanges 中创建数据源),我使用选择模型来处理选择行(使用 isAllSelected 和掌握 Toggle 方法)。
我需要将选定的行传递给第一个子组件,我使用包含行为主题的服务,因此我接下来使用设置数据方法来获取数据。
在第一个子组件中,我在垫表中使用数组形式,并处理选择,执行数据源的控制台日志(您在控制台中看到,当我在第二个列表组件中选择一个或多个或全部我在控制台中有一个循环,需要花一些时间来选择第二个列表组件中的所有或一个,可能是因为我在订阅方法中创建了一个表)
你可以发现我的 stack-blitz 包含这里的代码,
尝试使用 select ,我们可以看到这需要一些时间并在控制台中循环很多次
您在
this.setData()
方法中有 isAllSelected()
。它会导致您的对象被多次执行.next
。
isAllSelected()
在模板中每次更改检测时都会多次触发
[checked]="selection.hasValue() && isAllSelected()"
[indeterminate]="selection.hasValue() && !isAllSelected()"
如果您从
this.setData()
中删除对 isAllSelected
的调用,您将只能看到一个控制台日志