Impossible de lier le bouton ListView Cliquez dans un UserControl sur une commande dans ViewModel (MVVM Light Windows 10)

Question

J'ai un ListView où le ItemTemplateDataTemplate est placé dans un contrôle utilisateur distinct.

<local:ViewBase 
x:Class="FindTheCat.Views.ShopPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:FindTheCat.Views" 
xmlns:control="using:FindTheCat.UserControls" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" 
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity" 
xmlns:Core="using:Microsoft.Xaml.Interactions.Core" 
DataContext="{Binding Path=ShopPage, Source={StaticResource ViewModelLocator}}"> 

<Grid x:Name="gridRoot"> 
    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup x:Name="VisualStateGroup"> 
      <VisualState x:Name="VisualStateMin800"> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="800"/> 
       </VisualState.StateTriggers> 
.... 

    <RelativePanel HorizontalAlignment="Stretch"> 
     <TextBlock x:Name="textBlockTitle" Text="Shop" Style="{StaticResource HeaderTextBlockStyle}" RelativePanel.AlignHorizontalCenterWithPanel="True" Margin="24,48,24,28" FontSize="64"/> 
     <ListView x:Name="listView" HorizontalAlignment="Left" VerticalAlignment="Top" RelativePanel.Below="textBlockTitle" RelativePanel.AlignHorizontalCenterWithPanel="True" Margin="0,28,0,0" 
        ItemsSource="{Binding Products}" IsItemClickEnabled="False"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <control:ShopItemTemplate /> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </RelativePanel> 
</Grid> 
</local:ViewBase> 

ShopItemTemplate est un contrôle utilisateur.

<UserControl 
x:Class="FindTheCat.UserControls.ShopItemTemplate" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:local="using:FindTheCat.UserControls" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
xmlns:Interactivity="using:Microsoft.Xaml.Interactivity" 
xmlns:Core="using:Microsoft.Xaml.Interactions.Core" 
mc:Ignorable="d" 
> 

<Grid x:Name="grid" Width="600" Margin="0,36" > 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="Auto"/> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
    <Border > 
     <Image x:Name="image" Height="160" Width="160" Source="{Binding Uri}" VerticalAlignment="Top"/> 
    </Border> 
    <StackPanel x:Name="stackPanel" Grid.Column="1" Margin="16,0,0,0"> 
     <TextBlock x:Name="textBlock" Text="{Binding Title}" Style="{StaticResource BaseTextBlockStyle}" FontSize="24"/> 
     <TextBlock x:Name="textBlock1" Text="{Binding Description}" Style="{StaticResource BaseTextBlockStyle}" FontSize="16" TextWrapping="Wrap" Margin="0,12,0,0"/> 
     <Button x:Name="btnBuy" Content="{Binding Price, ConverterParameter=Buy, Converter={StaticResource PrependStringConverter}}" FontSize="24" RelativePanel.AlignLeftWith="txtTitle" RelativePanel.Below="txtDescription" Style="{StaticResource ButtonBuyStyle}" Background="#74b025" Width="256" Height="60" Margin="0,20,0,0"> 
      <Interactivity:Interaction.Behaviors> 
       <Core:EventTriggerBehavior EventName="Click"> 
        <Core:InvokeCommandAction Command="{Binding ElementName=gridRoot, Path=DataContext.BuyItemCommand}" CommandParameter="{Binding Id}"/> 
       </Core:EventTriggerBehavior> 
      </Interactivity:Interaction.Behaviors> 
     </Button> 
    </StackPanel> 

    <VisualStateManager.VisualStateGroups> 
     <VisualStateGroup x:Name="VisualStateGroup"> 
      <VisualState x:Name="VisualStateMin800"> 
       <VisualState.StateTriggers> 
        <AdaptiveTrigger MinWindowWidth="800"/> 
       </VisualState.StateTriggers> 

... 

</Grid> 
</UserControl> 

Les œuvres liseréest visuellement chaque élément est correctement montrant mais l'événement Click de btnBuy dans ShopItemTemplate ne remet pas BuyItemCommand dans le ShopPageViewModel

public ShopPageViewModel() 
    { 
     BuyItemCommand = new RelayCommand<string>(id => buyItem(id)); 

     if (!IsInDesignMode) 
     { 
      loadMockData(); 
     } 
    } 

    public RelayCommand<string> BuyItemCommand 
    { 
     get; 
     private set; 
    } 

    private void buyItem(string id) 
    { 
     Sound.Play(Sounds.Click); 
     InAppPurchase.BuyItem(id); 
    } 

Qu'est-ce que je fais mal?

Answer 1

Je l'ai compris. J'ai juste besoin de spécifier le datacontext correct en utilisant mon ViewModelLocator comme StaticResource. Donc, dans mon cas, les lignes

<Interactivity:Interaction.Behaviors> 
    <Core:EventTriggerBehavior EventName="Click"> 
     <Core:InvokeCommandAction Command="{Binding ElementName=gridRoot, Path=DataContext.BuyItemCommand}" CommandParameter="{Binding Id}"/> 
    </Core:EventTriggerBehavior> 
</Interactivity:Interaction.Behaviors> 

deviennent

<Interactivity:Interaction.Behaviors> 
    <Core:EventTriggerBehavior EventName="Click"> 
     <Core:InvokeCommandAction 
         Command="{Binding Path=ShopPage.BuyItemCommand, Source={StaticResource ViewModelLocator}}" 
         CommandParameter="{Binding Id}"/> 
     </Core:EventTriggerBehavior> 
</Interactivity:Interaction.Behaviors> 

ShopPage est mon point de vue et son ViewModel est accessible à l'aide ShopPage.BuyItemCommand