Catel: Treeview HierarchicalDataTemplate

Question

我已经开始用Catel为MVVM创建一个小的测试应用程序。我试着显示一个TreeView并创建一个ViewModel来显示所有的项目。但我犯了个错误。

<TreeView ItemsSource="{Binding ChildCollection}">
    <TreeView.ItemTemplate>
        <HierarchicalDataTemplate ItemsSource="{Binding ChildCollection}">
            <local:TreeViewItem DataContext="{Binding}" />
        </HierarchicalDataTemplate>
    </TreeView.ItemTemplate>
</TreeView>nter code here

TreeViewItem只是一个TextBlock。但是因为它是一个userControl，Catel应该为它创建ViewModel。下面的ViewModel代码是简化的。

public class TreeViewItemVm : ViewModelBase
{
    public TreeViewItemVm(ModelBase model)
    {
        Model = model;

        if(model is Group)
            // Set Properties
        else if(model is Customer)
            // Set Properties
        else if(model is Product)
            // Set Properties
    }

    [Model]
    public ModelBase Model {get; set; }
    public string DisplayText {get; set; }
    public ObservableCollection<ModelBase> ChildCollection {get; set; }
    public Command OpenItemCommand { get; private set; }

在运行这个时，我会得到错误

System.Windows.Data错误: 40 : BindingExpression路径错误：'ChildCollection‘属性在'object’Customer‘上找不到.

因此，HierarchicalDataTemplate ItemsSource="{Binding ChildCollection}"正在研究模型，而不是ViewModel。

模型不应该实现命令。所以这里的回答并不是特定的安装。有办法做到这一点吗？还是我必须用自己的CustomControl为echt类型显式定义它，就像在这个基本示例中所做的那样。还是有人知道猫的具体例子？

Answer 1

<TreeView ItemsSource="{Binding RootTreeViewItemVms}">
    <TreeView.Resources>
        <TreeView.ItemTemplate>
            <HierarchicalDataTemplate DataType={x:Type TreeViewItemVm} 
                                      ItemsSource="{Binding ChildCollection}">
                <TextBlock Text={Binding DisplayText} />
            </HierarchicalDataTemplate>
        </TreeView.ItemTemplate>
    <TreeView.Resources>
</TreeView>

您还应该具有从基本ViewModel继承的特定TreeViewItemVm类型。

public abstract class TreeViewItemVm: ViewModelBase
{
    public TreeViewItemVm()
    {
        ChildCollection = new ObservableCollection<TreeViewItemVm>();
    }

    public ObservableCollection<TreeViewItemVm> ChildCollection {get; }
    public Command OpenItemCommand { get; private set; }
    public string DisplayText {get; set; }
}

public abstract class TreeViewItemVm<T> where T: ModelBase
{
    public TreeViewItemVm(T model)
    {
        Model = model;
    }

    public T Model {get;}
}

public class GroupTreeViewItemVm: TreeViewItem<Group>
{
    public GroupTreeViewItemVm(Group group): base(group)
    {
        // group specific stuff here
    }
}

etc....

如果需要，您可以为每种特定的HierarchicalDataTemplates类型创建不同的ViewModel。

编辑

您的TreeViewItemVm类中也存在一个缺陷。

public ObservableCollection<ModelBase> ChildCollection {get; set; }

应该是

public ObservableCollection<TreeViewItemVm> ChildCollection {get; set; }