XAML의 click 이벤트에서 ViewModel에 정의 된 컬렉션에서 항목을 제거하십시오.

Question

DataTemplate에 정의되고 Canvas에 배치 된 항목으로 ItemsControl을 채 웁니다. Canvas에서 이러한 항목 중 하나에서 마우스 오른쪽 버튼 이벤트를 사용하여 내 ViewModel에있는 포함 된 컬렉션에서 해당 이벤트를 제거하고 싶습니다. MVVM Light의 EventToCommand를 사용하여 작업을 시도했지만 지금까지는 아무 것도 생각 해 내지 못했습니다. 나는 그 밖의 무엇을 시도해야하는지 모른다. 그래서 나는 도움을 청한다. 어떤 조언을 주시면 감사하겠습니다.

<DataTemplate DataType="{x:Type model:Player}"> 
     <Canvas>    
      <Grid Canvas.Left="{Binding Location.X}" 
        Canvas.Top="{Binding Location.Y}" 
        MouseLeftButtonDown="Grid_MouseLeftButtonDown" 
        MouseLeftButtonUp="Grid_MouseLeftButtonUp" 
        MouseMove="Grid_MouseMove"> 
       <Grid.LayoutTransform> 
        <RotateTransform Angle="-90" /> 
       </Grid.LayoutTransform> 
       <Ellipse Width="12" 
         Height="12" 
         Fill="{Binding PrimaryColor}" /> 
       <TextBlock HorizontalAlignment="Center" 
          VerticalAlignment="Center" 
          FontSize="6" 
          FontWeight="Bold" 
          Foreground="Black" 
          Text="{Binding Position.Abbreviation}" /> 
      </Grid> 
     </Canvas> 
    </DataTemplate> 

<Canvas x:Name="myCanvas" 
     Width="1440" 
     Height="640" 
     AllowDrop="True" 
     Background="Green" 
     Focusable="True"> 
    <ContentPresenter Content="{Binding Field}" /> 
    <ItemsControl ItemsSource="{Binding Team.Players}"> 
     <ItemsControl.ItemsPanel> 
      <ItemsPanelTemplate> 
       <Canvas AllowDrop="True" Background="Transparent" /> 
      </ItemsPanelTemplate> 
     </ItemsControl.ItemsPanel> 
    </ItemsControl> 
</Canvas> 

Answer 1

당신은 제거 MenuItem와 ContextMenu을 가질 수 있습니다. 그런 다음 ViewModel에 CommandRemoveCommand을 입력 할 수 있습니다. MenuItem 명령을 아래의 VM 명령에 바인딩하고 CommandParameter에 선택한 항목을 보낼 수 있습니다. 명령 처리기에서 해당 항목을 컬렉션에서 제거 할 수 있습니다.

<DataTemplate DataType="{x:Type model:Player}"> 
    <Canvas>    
     <Grid Tag="{Binding DataContext, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}} Canvas.Left="{Binding Location.X}" 
       Canvas.Top="{Binding Location.Y}" 
       MouseLeftButtonDown="Grid_MouseLeftButtonDown" 
       MouseLeftButtonUp="Grid_MouseLeftButtonUp" 
       MouseMove="Grid_MouseMove"> 
      <Grid.ContextMenu> 
       <ContextMenu> 
         <MenuItem Header="Remove" 
         Command="{Binding PlacementTarget.Tag.RemoveCommand, RelativeSource={RelativeSource AncestorType=ContextMenu}}" 
         CommandParameter="{Binding PlacementTarget.DataContext, 
      RelativeSource={RelativeSource FindAncestor, 
      AncestorType={x:Type ContextMenu}}}"/> 
        </ContextMenu> 
      </Grid.ContextMenu> 
      <Grid.LayoutTransform> 
       <RotateTransform Angle="-90" /> 
      </Grid.LayoutTransform> 
      <Ellipse Width="12" 
        Height="12" 
        Fill="{Binding PrimaryColor}" /> 
      <TextBlock HorizontalAlignment="Center" 
         VerticalAlignment="Center" 
         FontSize="6" 
         FontWeight="Bold" 
         Foreground="Black" 
         Text="{Binding Position.Abbreviation}" /> 
     </Grid> 
    </Canvas> 
</DataTemplate>