WPF binding to parent ItemsSource DataContext from DataTemplate item

Question

I have a ViewModel named "A", containing a property of type ObservableCollection(Of ChannelViewModel). The Model is actually inside this ChannelViewModel class and I'm ok with that.

In the View "A", I have a stackpanel with ItemsSource filled with the ObservableCollection. I added a DataTemplate to show a custom control "Channel" instead of the ChannelViewModel string. The Channel custom control needs to display ChannelViewModel data.

The problem is the DataContext of the Channel is not connected properly to each items of the list. I tried a bunch of things and nothing seems to work. I would appreciate some help please!

Here is the "A" View code:

<Window.DataContext>
    <ctrls:AViewModel/>
</Window.DataContext>
<StackPanel x:Name="uiStack" Orientation="Horizontal">
    <ItemsControl ItemsSource="{Binding Channels}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                 <ctrls:Channel DataContext="{Binding DataContext}"  />
            </DataTemplate>
        </ItemsControl.ItemTemplate>
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                 <WrapPanel/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>                
    </ItemsControl>            
</StackPanel>

Here is "A" ViewModel :

Private aChannels As New ObservableCollection(Of ChannelViewModel)
Property Channels As ObservableCollection(Of ChannelViewModel)
    Get
        Return aChannels
    End Get
    Set(value As ObservableCollection(Of ChannelViewModel))
        aChannels = value
        OnPropertyChanged("Channels")
    End Set
End Property

Public Sub New()
    AddChannels()
    OnPropertyChanged("Channels")
End Sub

Private Sub AddChannels()
    For i As Integer = 1 To DeviceConfig.Channels.Count
        Channels.Add(New ChannelViewModel(i)) 
    Next        
End Sub

The Channel UserControl is (simplified):

<UserControl.DataContext>
    <ctrls:ChannelViewModel />
</UserControl.DataContext>
<StackPanel Orientation="Horizontal">
    <Label x:Name="lblChannelNo" Content="{Binding ChannelNo}" />
    <Label x:Name="lblChannelName" Content="{Binding ChannelName}" />
</StackPanel>

And Channel ViewModel (simplified):

Public Class ChannelViewModel
    Inherits ViewModelBase

    Private aChannelNo As Integer = 0
    Property ChannelNo As Integer
        Get
            Return aChannelNo
        End Get
        Set(value As Integer)
            aChannelNo = value
            OnPropertyChanged("ChannelNo")
        End Set
    End Property

    Private aChannelName As String = "N/A"
    Property ChannelName As String
        Get
            Return aChannelName
        End Get
        Set(value As String)
            aChannelName = value
            OnPropertyChanged("ChannelName")
        End Set
    End Property

M.Parent M.Parent · Accepted Answer · 2015-04-21T01:16:28

Okay, the problem was in the Channel View. I think setting the DataContext was overwriting the context from the "A" View. So removing these lines solved the issue:

<UserControl.DataContext>
    <ctrls:ChannelViewModel />
</UserControl.DataContext>

I also had to change the binding to :

<DataTemplate>
    <ctrls:Channel DataContext="{Binding}"  />
</DataTemplate>

WPF binding to parent ItemsSource DataContext from DataTemplate item

1 Answers