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

Passing Datacontext as CommandParameter to Viewmodel in Windows 10

我正在以分组样式显示 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 中,我有一个弹出窗口,可以按需要工作。我可以保留显示的数据,弹出窗口将 appear/open。但是当我点击"Delete"时,'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 上的 "Delete" 时,它应该从 ObservableCollection 中删除数据,对吗?因为据我所知,flyout的DataContext是显示数据的DataContext,还是我错了?如何解决这个问题?

我的意思是,gridview 的 DataTemplate 中的 gridview's DataContext is the ObservableCollection, and the Stackpanels' DataContext 将是模型 Contact 对吗?由于 flyout 在项目创建时打开,所以 flyout 的 DataContext 将继承项目的 DataContext,如果 flyoutCommandParameter = "{Binding}",它应该通过 Contact 项目里面的视图模型,不是吗?

我可能遗漏了一些东西,但 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