ListDetailsView Does Not Respond to ObservableCollection Changes

[Gszekt]

Hi, I use Template Studio for WinUI generate a demo, it includes an ListDetails page, just as below:

When I add a button in ListDetailsPage.xaml and add a AddButton_Click event handler. In AddButton_Click, I call ViewModel.SampleItems.Clear(); and the UI update correctly. Then I do the same thing in ListDetailsDetailControl.xaml, the UI is not updated. Why doesn't it works?
Here is the code

ListDetailsDetailControl.xaml.cs

public sealed partial class ListDetailsDetailControl : UserControl
{
    public SampleOrder? ListDetailsMenuItem
    {
        get => GetValue(ListDetailsMenuItemProperty) as SampleOrder;
        set => SetValue(ListDetailsMenuItemProperty, value);
    }

    public static readonly DependencyProperty ListDetailsMenuItemProperty = DependencyProperty.Register("ListDetailsMenuItem", typeof(SampleOrder), typeof(ListDetailsDetailControl), new PropertyMetadata(null, OnListDetailsMenuItemPropertyChanged));

    public ListDetailsDetailControl()
    {
        InitializeComponent();
    }

    private static void OnListDetailsMenuItemPropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        if (d is ListDetailsDetailControl control)
        {
            control.ForegroundElement.ChangeView(0, 0, 1);
        }
    }

    private void AddButton_Click(object sender, RoutedEventArgs e)
    {
        App.GetService<ListDetailsViewModel>().SampleItems.Clear();
    }
}