在 Windows 10 中将 Datacontext 作为 CommandParameter 传递给 Viewmodel

Question

我在 gridview 中以分组样式显示数据。我已经可以创建新项目了。现在我想创建一个可以删除我创建的项目的函数。这是我的视图模型：

视图模型

public class VM : INotifyPropertyChanged
{
    public VM()
    {
        DeleteItem = new DelegateCommand(DeleteCurrentItem);
    }

    public ObservableCollection<Contact> ContList = new ObservableCollection<Contact>();

    private ObservableCollection<Category> _GroupedCollection;
    public ObservableCollection<Category> GroupedCollection
    {
        get
        {
            if (_GroupedCollection == null)
                _GroupedCollection = new ObservableCollection<Category>();
            return _GroupedCollection;
        }
        set
        {
            _GroupedCollection = value;
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs("GroupedCollection"));
        }
    }

    public void DeleteCurrentItem(object param)
    {
        var cont= param as Contact;
        // there is another class that declare another ObservableCollection that holds all the models.
        var category = GroupedCollection.FirstOrDefault(g => g.Key == cont.Account);
        if (category != null)
        {
            if (category.CredCategory.Contains(cont))
            {
                category.CredCategory.Remove(cont);
            }
        }
    }

    public DelegateCommand DeleteItem { get; set; }

    private string _Account;
    public string Account
    {
        get { return _Account; }
        set
        {
            _Account = value;
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs("Account"));
        }
    }


    public event PropertyChangedEventHandler PropertyChanged;
}

在我的 XAML 中，我有一个浮出控件，可以按需要工作。我可以保留显示的数据，然后弹出窗口将出现/打开。但是当我单击“删除”时，“gridview”不会删除它。

查看 (XAML)

<Page.DataContext>
    <data:VM/>
</Page.DataContext>
<Page.Resources>
    <CollectionViewSource x:Key="cvs" IsSourceGrouped="True" 
                          Source="{Binding GroupedCollection, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                          ItemsPath="CredCategory"/>
</Page.Resources>
<Grid>
   <FlyoutBase.AttachedFlyout>
       <MenuFlyout x:Name="flyout">
            <MenuFlyoutItem Text="Delete" 
                            Command="{Binding DataContext.DeleteItem, ElementName=gridview}" 
                            CommandParameter="{Binding}"/>
        </MenuFlyout>
   </FlyoutBase.AttachedFlyout>
   <GridView x:Name="gridview" 
             ItemsSource="{Binding Source={StaticResource cvs}}"
        <GridView.ItemTemplate>
                <DataTemplate>
                 .  .  .  .
                <DataTemplate/>
        <GridView.ItemTemplate>
    <GridView/>
<Grid/>

我正在显示代码隐藏以防有人想看到它。

查看（代码隐藏）

public void cardstack_pass_Holding(object sender, HoldingRoutedEventArgs e)
    {
        //this is the event declared in the Datatemplate inside gridview
        flyout.ShowAt(sender as FrameworkElement);
        e.Handled = true;
    }

正如我在上面所说，我的问题是当我单击flyout 上的“删除”时，它应该是从ObservableCollection 中删除数据对吧？因为据我所知flyout的DataContext是显示的数据的DataContext，还是我错了？如何解决这个问题？

我的意思是，gridview 的 DataContext 是 ObservableCollection，而 gridview 的 DataTemplate 中的 Stackpanels 的 DataContext 将是 Model Contact 对吧？由于flyout在创建的item处是打开的，所以flyout的DataContext会继承item的DataContext，如果flyout的CommandParameter = "{Binding}"，它应该把item里面的Contact传递给viewmodel ，不是吗？

Answer 1

我可能在这里遗漏了一些东西，但 AttachedFlyout 代码不应该放在 DataTemplate 中

注意将命令绑定到元素名称根（页面名称），因为我们在 GridView 中，例如

<Page x:Name="root">
    <Page.DataContext>
      <data:VM/>
    </Page.DataContext>
    <Page.Resources>
       <CollectionViewSource x:Key="cvs" IsSourceGrouped="True" 
                      Source="{Binding GroupedCollection, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                      ItemsPath="CredCategory"/>
    </Page.Resources>
    <Grid>
      <GridView x:Name="gridview" 
          ItemsSource="{Binding Source={StaticResource cvs}}"
          <GridView.ItemTemplate>
             <DataTemplate>
                 <FlyoutBase.AttachedFlyout>
                   <MenuFlyout x:Name="flyout">
                      <MenuFlyoutItem Text="Delete" 
                           Command="{Binding DataContext.DeleteItem, ElementName=root}" 
                           CommandParameter="{Binding}"/>
                 </MenuFlyout>
              </FlyoutBase.AttachedFlyout>                 
            <DataTemplate/>
        <GridView.ItemTemplate>
     <GridView/>
  <Grid/>

这个article 展示了如何使用 UWP 中提供的Behaviours。