Self Binding inside datatemplate not working

Question

I have a property in my model class as follows which is an enum.

public class VmOutputCarouselBarCodeServiceControlData : BindableBaseThreadSafe
{
 private SensorBufferState _lockStatus;
 public SensorBufferState LockStatus
        {
            get => _lockStatus;
            set => Set(ref _lockStatus, value);
        }
}

In my VM which is the DataContext of the whole view, I am setting the value as follows,

public class VM
{
public VmOutputCarouselBarCodeServiceControlData VmOutputControlData { get; set; }
public VM()
{
VmOutputControlData=new VmOutputCarouselBarCodeServiceControlData();
VmOutputControlData.LockStatus=SensorBufferState.Active;
}
}


    public enum SensorBufferState
    {
        Default,
        Active,
        InActive,
        Error
    }

In my xaml I have a datatemplate inside a datatemplate as follows:

<DataTemplate x:Key="OutputTemplate">
<Grid>
 <ContentControl Grid.Row="0" 
                 Grid.Column="1" 
                 DataContext="{Binding VmOutputControlData.LockStatus}" 
                 ContentTemplate="{StaticResource ErrorContentControl}"/>
</Grid>
</DataTemplate>

 <DataTemplate x:Key="ErrorContentControl">
                <Grid>
                    <Rectangle x:Name="SensorStatusRectangle"
                               Fill="{Binding Path=.,Mode=OneWay,Converter={StaticResource SensorBufferToColorConverter}}"
                               Height="30"
                               Width="60"/>
                </Grid>
            </DataTemplate>

In the xaml.cs

The data context is set to VM for the entire view

Problem is when I keep a breakpoint inside the converter class it never hits. But while its running when I remove the . from binding Path, the breakpoint comes to the converter. The DataContext of the ContentControl is showing as Active which is one of the enum states. Yet the binding is not working. Please help.

BionicCode BionicCode · Accepted Answer · 2020-04-15T16:08:03

The DataTemplate is actually not applying. It can't.

The DataTemplate or in general the ContentControl.ContentTemplate willl apply to the ContentControl.Content property and not to the ContentControl.DataContext.
This means the DataContext of the DataTemplate is not the DataContext of the ContentControl, but the Content or the value of the ContentControl.Content property.

To make the templating work, you must set the Content instead of the DataContext:

<ContentControl Content="{Binding VmOutputControlData.LockStatus}" 
                ContentTemplate="{StaticResource ErrorContentControl}"/>

Now that the ContentControl has content, the DataTemplate will be applied and the binding will resolve and invoke the converter.

<DataTemplate DataType={x:Type SensorBufferState}">
  <Grid>
    <Rectangle x:Name="SensorStatusRectangle"
               Fill="{Binding Path=., Mode=OneWay, Converter={StaticResource SensorBufferToColorConverter}}" />
  </Grid>
</DataTemplate>

Self Binding inside datatemplate not working

1 Answers