Pull parameter from parent page a razor component is on

Here's a portion of my page.

@page "/campaigns/{id:int}"@inject ICampaignService CampaignService@inject NavigationManager NavigationManager<PageTitle>Campaign Detail Page</PageTitle>@if (campaign == null){<span>@message</span><p><button class="btn btn-primary" @onclick="(() => ShowAll())">Back to Campaigns</button></p>}else{<div class="row"><div class="col-sm-8"><div class="container p-3 my-3 border"><h1>@campaign.Title</h1><p>@campaign.Description</p><p>This container has a border and some extra padding and margins.</p></div></div><div class="col-sm-4"><ChaptersByCampaignList />

Here's the ChaptersByCampaignList component.

@inject IChapterService ChapterService<h3>Chapters</h3><ul class="list-group">    @if (ChapterService.ChaptersByCampaign == null)    {<li class="list-group-item">No Chapters</li>    }    else    {        @foreach (var dbObject in ChapterService.ChaptersByCampaign)        {<li class="list-group-item">@dbObject.OrderIndex - @dbObject.Title</li>        }    }</ul>@code {    [Parameter]    public int Id { get; set; }    protected override async Task OnParametersSetAsync()    {        await ChapterService.GetAllByCampaignId(Id);    }}

The ChaptersService has these snippets of code.

public List<Chapter> Chapters { get; set; }public List<Chapter> ChaptersByCampaign { get; set; }public async Task GetAllByCampaignId(int id){    var response = await _httpClient.GetFromJsonAsync<List<Chapter>>($"api/chapters/campaign/{id}");    if (response != null)        ChaptersByCampaign = response;}

First, the ChaptersByCampaignList component doesn't seem to be getting the CampaignId passes through the URL, through debugging I can see it keeps being set to 0. I'm needing to get id from the passes URL @page "/campaigns/{id:int}"

Thanks!