получить документ по идентификатору из коллекции firestore на angular

У меня есть набор действий, в котором есть несколько документов. Я хочу получить определенный документ нажатием кнопки.

Коллекция: действия

Идентификатор документа: автоматический идентификатор

Поля: идентификатор активности, заблокировано, раздел, maxPlayers, имя.

здесь я получаю всю коллекцию как

this.activities = afs.collection('activities', x => x.orderBy('section', 
'asc')).valueChanges();

И я показываю эти коллекции в таблице как;

<tr *ngFor="let activity of activities | async  | paginate: { itemsPerPage: 10, currentPage: p }; let i =index">
    <td>
        {{activity.section}}
    </td>
    <td >
        {{activity.name}}
    </td>
    <td>
        {{activity.maxPlayers}}
    </td>
    <td>
        {{activity.locked}}
    </td>
    <td>
        <button type="button" class="btn btn-success" 
            (click)="onEdit(activity.id);  secondModal.show() "><i 
            class="fa fa-pencil"></i>
                       Edit
        </button>
</td>

Я передал аргумент id функции OnEdit (). В функции OnEdit я хочу получить выборочный документ по идентификатору. И покажите эти поля документа в модели как:

<div *ngFor="let activity of activities | async >
    {{activity.section}}        
    {{activity.name}}                    
    {{activity.maxPlayers}}                    
    {{activity.locked}}

Я перепробовал так много мыслей, но ничего не вышло. Всегда показывает все документы. Я хочу получить только тот документ, который нажимается кнопкой.