Angular Material tree-checklist组件如何获取选中节点？

嘿，我之前也踩过这个坑！那个示例里的isSelected方法其实是示例自定义的辅助函数，并不是组件内置的通用方法。要获取选中的节点，咱们得用Material Tree自带的SelectionModel来操作，具体步骤很清晰：

• 第一步：确认你已经初始化了SelectionModel
  在组件类里，应该已经有类似这样的代码（如果没有的话得先加上）：

  import { SelectionModel } from '@angular/cdk/collections';
  // 假设你的节点类型是FlatTreeNode，根据实际情况替换
  selection = new SelectionModel<FlatTreeNode>(true, []);
  

  第一个参数true代表支持多选，第二个参数是初始选中的节点数组（可以为空）。

• 直接获取所有选中节点
  想要拿到当前所有选中的节点，直接访问selection.selected就可以了，它会返回一个包含所有选中节点的数组：

  // 获取选中节点数组
  const selectedNodes = this.selection.selected;
  
  // 遍历处理节点，比如打印或者提交数据
  selectedNodes.forEach(node => {
    console.log('当前选中的节点:', node);
    // 这里可以根据节点的属性做后续操作，比如node.id、node.label等
  });
  

• 监听选中状态的变化
  如果需要实时响应节点选中/取消选中的操作，可以订阅selection.changed事件：

  this.selection.changed.subscribe(change => {
    console.log('新增选中的节点:', change.added);
    console.log('取消选中的节点:', change.removed);
    // 在这里处理状态变化后的逻辑，比如更新表单、发送请求等
  });
  

• 判断单个节点是否选中
  如果你需要判断某个特定节点是否被选中，别用示例里的自定义方法，直接用SelectionModel内置的isSelected方法：

  // 假设node是你要判断的节点对象
  const isNodeSelected = this.selection.isSelected(node);
  console.log(`该节点是否选中：${isNodeSelected}`);
  

总结一下，示例里的isSelected只是封装了内置方法的简化写法，核心还是靠SelectionModel来管理和获取选中状态。按照上面的步骤来，就能轻松拿到你需要的选中节点啦！

内容的提问来源于stack exchange，提问作者tomdurand