使用数据绑定访问DataTemplate中的WPF组件

Question

我在XmlConfigurator.Configure()绑定了DataTemplate个视频对象的几个UI元素。当我单击相应UI元素的ContextMenuItem [Test]时，我想调用Video对象的方法。

这是我的XAML：

ObservableCollection

这是集合：

            <ItemsControl Name="VideoUIElment" >
                <ItemsControl.ItemTemplate>
                    <DataTemplate x:Uid="videoTemplate">
                        <Border CornerRadius="10" Padding="10, 10" Background="Silver" >
                            <TextBlock Name="label" Text="{Binding Name}" FontSize="30" Foreground="Black" VerticalAlignment="Center" HorizontalAlignment="Center">
                                <TextBlock.ContextMenu>
                                    <ContextMenu>
                                        <MenuItem Header="[TEST]" Name="Test" Click="Test_Click"/>
                                    </ContextMenu>
                                </TextBlock.ContextMenu>
                            </TextBlock>                              
                        </Border>
                    </DataTemplate>
      </ItemsControl.ItemTemplate>
                </ItemsControl>

我知道，要做到这一点，我必须确定集合中的哪个Video对象绑定到我点击的特定UI元素，我可以想出一些技巧来实现这一点，但我想以优雅和聪明的方式做到这一点。 我已经看到了一些建议，但似乎没有一个适用于此。我想，它应该是容易的，但我还不是很熟悉WPF。

Answer 1

试试这个：

<强>主窗口：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css" rel="stylesheet">

<nav role="navigation">
  <ul id="menu" class="overlay-menu">
    <li><a href="#">Home</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
  <a class="button-toggle-overlay-menu" href="#menu"><i class="fi-plus"></i></a>
</nav>

<div class="title-bar" data-responsive-toggle="example-menu" data-hide-for="medium">
  <button class="menu-icon" type="button" data-toggle></button>
  <div class="title-bar-title">Menu</div>
</div>

<div class="top-bar" id="example-menu">
  <div class="top-bar-left">
    <ul class="dropdown menu" data-dropdown-menu>
      <li class="menu-text">Site Title</li>
      <li>
        <a href="#">One</a>
        <ul class="menu vertical">
          <li><a href="#">One</a></li>
          <li><a href="#">Two</a></li>
          <li><a href="#">Three</a></li>
        </ul>
      </li>
      <li><a href="#">Two</a></li>
      <li><a href="#">Three</a></li>
    </ul>
  </div>
  <div class="top-bar-right">
    <ul class="menu">
      <li><input type="search" placeholder="Search"></li>
      <li><button type="button" class="button">Search</button></li>
    </ul>
  </div>
</div>

<h1>Hello, world!</h1>

视频

public partial class MainWindow : Window
{
    ObservableCollection<Video> videos { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        videos = new ObservableCollection<Video>
        {
            new Video {Name = "Video 1"},
            new Video {Name = "Video 2"},
            new Video {Name = "Video 3"}
        };

        VideoUIElment.ItemsSource = videos;
    }

    private void Test_Click(object sender, RoutedEventArgs e)
    {
        MenuItem item = (MenuItem)sender;

        Video video = (Video)item.DataContext;

        MessageBox.Show(video.VideoMethod());
    }
}