如何正确地将集合数据绑定到TabControl

本文关键字：数据绑定 TabControl 集合 正确地 | 更新日期: 2023-09-27 18:09:23

我已经查看了SO上的几个问题/答案，出于某种原因，我没有找到任何将集合绑定到TabControl的方法。我正在尝试这样做，这样我就不需要在后面的代码中分配DataContext了。

以下是视图模型：

public class DocumentsCollectionViewModel : IEnumerable<DocumentViewModel> {
    private readonly ObservableCollection<DocumentViewModel> mDocsCollection = new ObservableCollection<DocumentViewModel>();
    public ObservableCollection<DocumentViewModel> Documents {
        get { return mDocsCollection; }
    }
    // initially excluded from question as I thought it was understood :)
    public IEnumerator<DocumentViewModel> GetEnumerator() {
        return mDocsCollection.GetEnumerator();
    }
    IEnumerator IEnumerable.GetEnumerator() {
        return mDocsCollection.GetEnumerator();
    }
}

为了完整起见，DocumentViewModel:

public class DocumentViewModel {
    private readonly Document mDocument;

    public string Name {
        get { return mDocument.Name; }
    }
}

在XAML中，我有点困惑于告诉选项卡控件在DocumentsCollectionViewModel:中使用Documents属性的位置

<TabControl Name="DocumentsTab"
            ItemsSource="{Binding localmodels:DocumentsCollectionViewModel}">
    <TabControl.ItemTemplate>
        <DataTemplate DataType="{x:Type localmodels:DocumentViewModel}">
            <Label Style="{StaticResource DefaultFont}"
                   Content="{Binding Name}"/>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate DataType="{x:Type localmodels:DocumentViewModel}">
            <Label Style="{StaticResource DefaultFont}"
                   Content="{Binding Name}"/>
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>

如何正确地将集合数据绑定到TabControl

是否已将具有此TabControl的Window/UserControl的DataContext设置为DocumentsCollectionViewModel的实例？

尝试在包含TabControl 的窗口的构造函数中执行此操作

public void MainWindow()
{
     InitializeComponents();
     this.DataContext = new DocumentsCollectionViewModel();
     //Initialize the collection inside your VM
}

或者你可以像一样在xaml中设置DataContext

<Window>
   <Window.DataContext>
       <localmodels:DocumentsCollectionViewModel/>
   </Window.DataContext>
</Window>

然后在您的xaml中直接绑定到Documents属性

<TabControl Name="DocumentsTab"
        ItemsSource="{Binding Documents}">
    <TabControl.ItemTemplate>
        <DataTemplate DataType="{x:Type localmodels:DocumentViewModel}">
            <Label Style="{StaticResource DefaultFont}"
                   Content="{Binding Name}"/>
        </DataTemplate>
    </TabControl.ItemTemplate>
    <TabControl.ContentTemplate>
        <DataTemplate DataType="{x:Type localmodels:DocumentViewModel}">
            <Label Style="{StaticResource DefaultFont}"
                   Content="{Binding Name}"/>
        </DataTemplate>
    </TabControl.ContentTemplate>
</TabControl>
相关文章：