Question

我有一个TabControl，它正在使用以下命令显示我想要的方式：

<TabControl Grid.Row="1" Background="{x:Null}" ItemsSource="{Binding TabPanels}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding Content.DataContext.BreadcrumbEnd}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <ContentControl Content="{Binding Content}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

这将在每个选项卡上显示正确的标题以及其中的内容。项目源绑定到ObservableCollection，其中ContentAreaHolder如下：

public ContentAreaHolder(UserControl content)
{
    this.Content = content;
}

private UserControl _Content;
public UserControl Content
{
    get
    {
        return _Content;
    }
    set
    {
        _Content = value;
        OnPropertyChanged("Content");
    }
}

它看起来超级凌乱，完全没有必要。但是，我从ObservableCollection开始，无法获得相同的效果。我使用了稍微修改过的xaml：

<TabControl Grid.Row="1" Background="{x:Null}" ItemsSource="{Binding TabPanels}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding DataContext.BreadcrumbEnd}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <ContentControl Content="{Binding .}" />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

，内容正确显示，但标题保持空白。

我尝试通过DisplayMemberPath设置标头，但没有绑定，只是将其设置为DataContext.BreadcrumbEnd无济于事。

为什么我的标题显示不正确？

Answer 1

您不应将UI元素添加到视图模型的源集合中。 TabPanels应该是ObservableCollection<YourType>而不是ObservableCollection<UserControl>。 YourType是定义BreadcrumbEnd属性的类。然后，您可以这样做：

<TabControl ItemsSource="{Binding TabPanels}">
    <TabControl.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding BreadcrumbEnd}" />
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate>
            <local:UserControl />
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

将TabControl ItemsSource和标头绑定在一起

1 个答案: