UWP中数据模板内的DataBinding答案

【问题标题】：DataBinding inside data template in UWPUWP中数据模板内的DataBinding
【发布时间】：2020-06-16 09:22:28
【问题描述】：

我有一个如下的用户控件，其中包含 DataTemplate。我想将 DataTemplate 中的数据绑定到 DataContext 中的一个属性。令人沮丧的是，在 Uwp 中，他们没有祖先类型，我怎样才能让我的东西正常工作。我已经参考了这篇文章UWP Databinding: How to set button command to parent DataContext inside DataTemplate，但它不起作用。请帮忙。

用户控制：

<local:CommonExpanderUserControl>
<local:CommonExpanderUserControl.ExpanderContent>
 <DataTemplate x:DataType="Data:VmInstrumentSettingsLocal">
<StackPanel>
<TextBlock Text="{Binding LisLocalSettings.SomeText}"/>
<controls:ButtonBadged x:Name="ButtonApplyLisLocalChanges" Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2"
                                               x:Uid="/Application.GlobalizationLibrary/Resources/InstrumentSettingsViewButtonApply"
                                               HorizontalAlignment="Center"
                                               Margin="8"
                                               Command="{Binding LisLocalSettings.SaveLisSettings}"/>
</StackPanel>
</DataTemplate>
</local:CommonExpanderUserControl.ExpanderContent>
</CommonExpanderUserControl>

在我的 UserControl xaml.cs 中如下。我想将按钮命令绑定到 LisLocalSettings 中的 Command 属性，但它不起作用。

public InstrumentSetupLocalSettingsView()
        {
            this.InitializeComponent();
            DataContext = this;
        }
 public static readonly DependencyProperty LisLocalSettingsProperty = DependencyProperty.Register(
            nameof(LisLocalSettings),
            typeof(VmInstrumentSettingsLisLocal), 
            typeof(InstrumentSetupLocalSettingsView), 
            new PropertyMetadata(default(VmInstrumentSettingsLisLocal)));

        public VmInstrumentSettingsLisLocal LisLocalSettings
        {
            get => (VmInstrumentSettingsLisLocal) GetValue(LisLocalSettingsProperty);
            set => SetValue(LisLocalSettingsProperty, value);
        }

【问题讨论】：

标签： xaml uwp datatemplate

【解决方案1】：

UWP中数据模板内的DataBinding

你可以将Command放在数据源中，但是如果数据源是集合，我们需要实现多个命令实例。通常，我们将命令放在可以重用的当前 DataContext 中。详细步骤请参考以下。

<Page.Resources>
    <DataTemplate x:Key="HeaderTemplate">
        <StackPanel
            x:Name="ExpanderHeaderGrid"
            Margin="0"
            Padding="0"
            HorizontalAlignment="Stretch"
            Background="Red"
            Orientation="Vertical"
            >
            <TextBlock x:Name="TextBlockLisSharedSettingsTitle" Text="{Binding}" />
            <Button Command="{Binding ElementName=RootGrid, Path=DataContext.BtnCommand}" Content="{Binding}" />
        </StackPanel>
    </DataTemplate>
</Page.Resources>
<Grid x:Name="RootGrid">
    <uwpControls:Expander Header="hello" HeaderTemplate="{StaticResource HeaderTemplate}" />
</Grid>

代码背后

public sealed partial class MainPage : Page
{
    public MainPage()
    {
        this.InitializeComponent();
        this.DataContext = this;
    }
    public ICommand BtnCommand
    {
        get
        {
            return new CommadEventHandler<object>((s) => BtnClick(s));
        }
    }

    private void BtnClick(object s)
    {

    }
}
public class CommadEventHandler<T> : ICommand
{
    public event EventHandler CanExecuteChanged;

    public Action<T> action;
    public bool CanExecute(object parameter)
    {
        return true;
    }

    public void Execute(object parameter)
    {
        this.action((T)parameter);
    }
    public CommadEventHandler(Action<T> action)
    {
        this.action = action;

    }
}

【讨论】：