How to use DataBindings in UserControls (works in page but not in uc)

There are several questions about this but I understand too little about the subject to understand what I am missing.

It's my first time working in WPF and I want to create several submodules (what are called UserControls I believe) to make the XAML easier to read and keep everything as its own part and potentially reusable.

I followed a YouTube video online to get the following code working:

XAML

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <StackPanel>
        <ListView ItemsSource="{Binding Items}" />
    </StackPanel>
</Window>

Code Behind

using System.Collections.ObjectModel;
using System.Windows;

namespace WpfApp1
{    
    public partial class MainWindow : Window
    {
        private ObservableCollection<string> _items;
        public ObservableCollection<string> Items
        {
            get { return _items; }
            set { _items = value; }
        }
        public MainWindow()
        {
            DataContext = this;
            _items = new ObservableCollection<string>();
            InitializeComponent();
            Items.Add("Item 1");
            Items.Add("Item 2");
        }
    }
}

Which correctly renders a ListView with the two items.

Now I basically just copied the logic. I created a new UserControl in a subfolder "Components":

XAML

<UserControl x:Class="WpfApp1.Components.ExampleComponent"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfApp1.Components"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800">
    <Grid>
        <ListView ItemsSource="{Binding OtherItems}" />
    </Grid>
</UserControl>

using System.Collections.ObjectModel;
using System.Windows.Controls;

namespace WpfApp1.Components
{    
    public partial class ExampleComponent : UserControl
    {
        private ObservableCollection<string> _otherItems;

        public ObservableCollection<string> OtherItems
        {
            get { return _otherItems; }
            set { _otherItems = value; }
        }

        public ExampleComponent()
        {
            _otherItems = new ObservableCollection<string>();
            InitializeComponent();

            OtherItems.Add("Other 1");
            OtherItems.Add("Other 2");
        }
    }
}

Then I added the following line into the main window's StackPanel:

<Components:ExampleComponent />

and

 xmlns:Components="clr-namespace:WpfApp1.Components"

as an additional Window property.

What I get now is the first ListView and a second empty one below it.

I'd like to understand why this doesn't work, and how I can fix it.

You forgot to set the DataContext of the UserControl:

public ExampleComponent()
{
    _otherItems = new ObservableCollection<string>();
    InitializeComponent();
    DataContext = this; //<--

    OtherItems.Add("Other 1");
    OtherItems.Add("Other 2");
}

Note that a UserControl should generally speaking inherit the DataContext from its parent element.

You can then bind directly to the Items collection of the parent window:

<ListView ItemsSource="{Binding Items}" />

Instead of setting the DataContext property of the UserControl and break the inheritance chain, you could bind to a specific property of the UserControl itself using a RelativeSource:

<ListView ItemsSource="{Binding OtherItems,
    RelativeSource={RelativeSource AncestorType=UserControl}}" />