将 CustomControl 绑定到 DataGrid 的数据模板内的 ObservableCollection 的项目时出错

Question

我有一个 DataGrid，它的源是站点的 ObservableCollection。我有一些列在绑定到站点属性的 DataTemplate 中定义。当使用像 TextBlock 这样的内置控件时，绑定工作得很好，但我无法使用自定义控件来完成它。我已经看到这个错误出现在控制台中，但我不明白我必须做什么：

System.Windows.Data Error: 40 : BindingExpression path error: 'Port' property not found on 'object' ''TestControl' (Name='')'. BindingExpression:Path=Port; DataItem='TestControl' (Name=''); target element is 'TestControl' (Name=''); target property is 'CameraName' (type 'String')

这里附上我使用的代码片段；

数据网格：

<DataGrid Name="SitesList" CanUserReorderColumns="True"  
                  ItemsSource="{Binding ViewModel.Sites}"
                  PreparingCellForEdit="DataGrid_PreparingCellForEdit" 
                  >                      
<DataGrid.Resources>
    <DataTemplate x:Key="CameraTemplate">
        <Grid>
            <hv:TestControl CameraName="{Binding Path=Port}"/>
        </Grid>
    </DataTemplate>
    <DataTemplate x:Key="PortTemplate">
        <TextBox x:Name="PortTextBox"
            Text="{Binding Path=Port, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
    </DataTemplate>
</DataGrid.Resources>
<DataGrid.Columns>
    <DataGridTemplateColumn Header="Camera"
                            CellTemplate="{StaticResource CameraTemplate}"
                            MinWidth="100"/>
    <DataGridTemplateColumn Header="Port"
                            CellTemplate="{StaticResource PortTemplate}"
                            MinWidth="70"/>
</DataGrid.Columns></DataGrid>

Observable 集合：

    private ObservableCollection<Site> m_sites = new ObservableCollection<Site>();
    public ObservableCollection<Site> Sites
    {
        get
        {
            return m_sites;
        }
        set
        {
            m_sites = value;
        }
    }

Site.cs:

namespace Wizard.View
{
    public class Site: INotifyPropertyChanged
    {
        #region properties
        public event PropertyChangedEventHandler PropertyChanged;
        private void NotifyPropertyChanged(String info)
        {
            if (PropertyChanged != null) {
                PropertyChanged(this, new PropertyChangedEventArgs(info));
            }
        }
        private string m_port = "0";
        public string Port
        {
            get
            {
                return m_port;
            }
            set
            {
                m_port = value;
                NotifyPropertyChanged("Port");
            }
        }
        #endregion        
    }
}

TestControl.xaml.cs:

namespace Wizard.View.HelpersViews
{
    public partial class TestControl: UserControl
    {
        public TestControl()
        {
            InitializeComponent();
        }

        public string CameraName
        {
            get { return (string)GetValue(CameraNameProperty); }
            set {
                Console.WriteLine(value);
                SetValue(CameraNameProperty, value);
                CameraNameTextBlock.Text = value;
            }
        }

        public static readonly DependencyProperty CameraNameProperty =
            DependencyProperty.Register("CameraName",
                                        typeof(string),
                                        typeof(TestControl),
                                        new PropertyMetadata("0"));
    }
}

TestControl.xaml:

<UserControl
             x:Class="Wizard.View.HelpersViews.TestControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             DataContext="{Binding RelativeSource={RelativeSource Self}}"
             d:DesignHeight="100" d:DesignWidth="300">
    <StackPanel Orientation="Horizontal" Height="Auto" HorizontalAlignment="Left">
        <CheckBox Margin ="5,0" Name="AddCameraCheck"
                  VerticalAlignment="Center" Style="{StaticResource ConfiguratorCheckBox}" />
        <TextBlock x:Name="CameraNameTextBlock" Width="175" Text="{Binding CameraName}" />
    </StackPanel>
</UserControl>

端口绑定正确，但摄像头绑定不正确。

Answer 1

TestControl 中的 TextBlock 应该绑定到 CameraName 属性本身：

<TextBlock x:Name="CameraNameTextBlock" Width="175" Text="{Binding CameraName, 
                                       RelativeSource={RelativeSource AncestorType=UserControl}}" />

...但是您应该删除它以使控件从 DataGridRow:

继承 DataContext

DataContext="{Binding RelativeSource={RelativeSource Self}}"

此外，依赖项属性的 CLR 包装器应该只调用 GetValue 和 SetValue:

public string CameraName
{
    get { return (string)GetValue(CameraNameProperty); }
    set { SetValue(CameraNameProperty, value); }
}

将 CustomControl 绑定到 DataGrid 的数据模板内的 ObservableCollection 的项目时出错

Error binding CustomControl to Items of a ObservableCollection inside the Datatemplate of a DataGrid

c#

data-binding

wpf

wpf-controls

wpfdatagrid