DataTemplate中ContextMenu用RelativeSource绑定ListView DataContext失败如何解决？

问题根源 #

• 核心原因是ContextMenu不属于WPF的主视觉树，它内部的元素由独立的Popup控件承载，存在于单独的渲染树中。RelativeSource.Mode=FindAncestor仅能在同一条视觉树中向上遍历，因此永远无法找到外层的ListView，绑定自然失效。
• 当前的Command绑定默认指向了DataTemplate的当前数据源（即ProjectGroups集合中的单个元素），也没有命中外层ListView对应的视图模型。

修复方案 #

推荐使用最简单的PlacementTarget关联方案，利用ContextMenu的PlacementTarget属性指向挂载它的Label（Label在主视觉树中，可以正常向上查找父元素）实现绑定，步骤如下：

1. 给ContextMenu挂载的Label添加Tag属性，提前绑定到外层ListView的DataContext
2. MenuItem的绑定通过ContextMenu.PlacementTarget.Tag获取到外层视图模型，再绑定对应属性

修复后完整代码 #

<ListView ItemsSource="{Binding ProjectGroups}" SelectedItem="{Binding SelectedProjectGroup}" HorizontalContentAlignment="Stretch">
    <ListView.ItemTemplate>
        <DataTemplate>
            <!-- 给Label加Tag属性，提前绑定外层ListView的DataContext -->
            <Label Content="{Binding Name}" Tag="{Binding DataContext, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ListView}}}">
                <Label.ContextMenu>
                    <ContextMenu>
                        <!-- 通过ContextMenu的PlacementTarget拿到Label，再读取Tag中存储的外层DataContext -->
                        <MenuItem Header="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ContextMenu}}, Path=PlacementTarget.Tag.DeleteText}" 
                                  Command="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type ContextMenu}}, Path=PlacementTarget.Tag.DeleteGroup}">
                        </MenuItem>
                    </ContextMenu>
                </Label.ContextMenu>
            </Label>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

可选简化方案 #

如果不想通过Tag中转，也可以给ListView设置名称后用x:Reference直接绑定：

<ListView x:Name="ProjectListView" ItemsSource="{Binding ProjectGroups}" SelectedItem="{Binding SelectedProjectGroup}" HorizontalContentAlignment="Stretch">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Label Content="{Binding Name}">
                <Label.ContextMenu>
                    <ContextMenu>
                        <MenuItem Header="{Binding DataContext.DeleteText, Source={x:Reference ProjectListView}}" 
                                  Command="{Binding DataContext.DeleteGroup, Source={x:Reference ProjectListView}}">
                        </MenuItem>
                    </ContextMenu>
                </Label.ContextMenu>
            </Label>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

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