绑定命令不起作用

Question

我是 WPF 开发的初学者。 我创建了一些带有框架的窗口。 我为框架编写了一个模板，我试图绑定到框架模板命令中的按钮，但没有成功。

见下一段代码：

    <Grid.Resources>
<ControlTemplate TargetType="Frame" x:Key="NavigationButtonsTemplates">
                <DockPanel>
                    <StackPanel 
            Margin="7"
            Orientation="Horizontal"
            DockPanel.Dock="Bottom"
            HorizontalAlignment="Right"
            >
                        <Button 
                Content="Back" 
                Command="{x:Static NavigationCommands.BrowseBack}"  
                Margin="5,0,5,0" Width="80" />

                        <Button 
                Content="Next" 
                Command="{Binding Path=NavigateToPersonalDataCommand}"
                Margin="5,0,5,0" Width="80"></Button>
                    </StackPanel>
                    <Border 
            BorderBrush="LightBlue"
            Margin="7,8,9,0"
            BorderThickness="7"
            Padding="5"
            CornerRadius="7"
            Background="White"
            >
                        <ContentPresenter />
                    </Border>
                </DockPanel>
            </ControlTemplate>
        </Grid.Resources>

按钮的绑定似乎不起作用。 当我把按钮放在标签外面时，它工作得很好。 如何将命令绑定到位于 中的按钮？

谢谢

Answer 1

您的ControlTemplate 需要有一个DataContext。尝试更改DockPanel 元素以绑定到模板框架上的DataContext 属性。这假定正在模板化的Frame 具有有效的DataContext。

<DockPanel DataContext="{Binding DataContext, RelativeSource={RelativeSource TemplatedParent}}">

或

<DockPanel DataContext="{TemplateBinding DataContext}">

编辑：

在尝试运行您的代码后，我发现了问题。您在 XAML 中绑定的属性与您的视图模型上的属性不匹配。

将 XAML 更改为绑定到视图模型上的属性名称可以解决问题。

从这里：

Command="{Binding Path=NavigateNext}"
Command="{Binding Path=NavigateToPersonalData}"

到这里：

Command="{Binding Path=BrowseNext}"
Command="{Binding Path=NavigateToPersonalDataCommand}"

匹配您的视图模型属性：

public ICommand BrowseNext
{
    get
    {
        return m_BrowseNext;
    }
    set
    {
        m_BrowseNext = value;
    }
}

public ICommand NavigateToPersonalDataCommand
{
    get
    {
        return m_PersonalDataCommand;
    }
    set
    {
        m_PersonalDataCommand = value;
    }
}

Answer 2

这是 Xaml 代码：

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:TestProj"
    x:Class="TestProj.MainView"
    x:Name="Window"
    Title="MainView"
    Width="640" Height="480">
    <Window.DataContext>
        <local:NavigationViewModel/>
    </Window.DataContext>

    <Grid x:Name="LayoutRoot">
        <Grid.RowDefinitions>
            <RowDefinition Height="0.25*"/>
            <RowDefinition Height="0.25*"/>
            <RowDefinition Height="0.25*"/>
            <RowDefinition Height="0.25*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="0.20*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <Grid.Resources>
            <ControlTemplate TargetType="Frame" x:Key="NavigationButtonsTemplates">
                <DockPanel DataContext="{TemplateBinding DataContext}">
                    <StackPanel 
            Margin="7"
            Orientation="Horizontal"
            DockPanel.Dock="Bottom"
            HorizontalAlignment="Right"
            >
              <Button 
                Content="Back" 
                Command="{Binding Path=NavigateNext}"
                Margin="5,0,5,0" Width="80" />

                        <Button 
                Content="Next" 
                Command="{Binding Path=NavigateToPersonalData}"

                Margin="5,0,5,0" Width="80"></Button>
                    </StackPanel>
                    <Border 
            BorderBrush="LightBlue"
            Margin="7,8,9,0"
            BorderThickness="7"
            Padding="5"
            CornerRadius="7"
            Background="White"
            >
                        <ContentPresenter />
                    </Border>
                </DockPanel>
            </ControlTemplate>
        </Grid.Resources>

        <Button Content="Opening" Grid.Row="0"></Button>
            <Button Content="Personal Data" Grid.Row="1"></Button>
        <Button Content="Business Data" Grid.Row="2"> </Button>
        <Button Content="Summery Report" Grid.Row="3"></Button>

        <DockPanel Grid.Column="2" Grid.RowSpan="4">
            <Frame x:Name="mainFrame" Template="{StaticResource NavigationButtonsTemplates}"/>

        </DockPanel>
    </Grid>
</Window>

我是这样写命令的：

class NavigationViewModel
    {
        private ICommand m_BrowseNext;
        public ICommand BrowseNext
        {
            get
            {
                return m_BrowseNext;
            }
            set
            {
                m_BrowseNext = value;
            }
        }

        private ICommand m_PersonalDataCommand;
        public ICommand NavigateToPersonalDataCommand
        {
            get
            {
                return m_PersonalDataCommand;
            }
            set
            {
                m_PersonalDataCommand = value;
            }
        }

        public NavigationViewModel()
        {
            BrowseNext = new RelayCommand(new Action<object>(NavigateNext));
            NavigateToPersonalDataCommand = new RelayCommand(new Action<object>(NavigateToPersonalData));
        }


        public void NavigateToPersonalData(object obj)
        {
            MainView.Instance.GetMainFrame.Navigate(Pages.Opening.Instance);
        }

        public void NavigateNext(object obj)
        {
            MainView.Instance.GetMainFrame.Navigate(Pages.PersonalData.Instance);
        }
   }

当我将按钮移到命令之外时效果很好，所以我认为问题出在 XAML 中。

谢谢！！！