How to use ngIf to hide Links?

I'll tell you what I need right away, then I'll go into more detail on my problem.

I need to hide this link from editing, how can I do this with ngIF?

<div class="col-lg-4">
        <h1>{{ title }}</h1>
        <div class="siderbar-admin" data-simple-id="simples-nav-stacked">
            <ul class="nav nav-pills nav-stacked nav-pills-stacked-example">

                <li role="presentation" [routerLinkActive]="['active']">
                  <a [routerLink]="['list-restaurant']">Lista</a>

                </li>
                <li role="presentation" [routerLinkActive]="['active']" >
                    <a [routerLink]="['add-restaurant']" >Adicionar</a>

                </li>
                <li role="presentation" [routerLinkActive]="['active']">
                     <a [routerLink]="['Edit/:id']" >Editar</a>

                </li>

            </ul>
        </div>
    </div>


    <div class="col-lg-8">
      <router-outlet></router-outlet>
    </div>

Let's go for a detailed explanation, look at the image below;

Asyoucanseethereisalinktolist,addandedit,butwhenIleavethelistfortheEditlinkwithoutclickingtheeditbuttononthelistpagethesystemgeneratesanerror,thisisbecausetheeditformwasloadedwithouttheidoftherecord.Toavoidsuchproblemsitwouldbeimportantfortheeditlinktobeshownonlywhentheuserclickstheeditbuttononthelistpage,

HowdoIneedthesystemtobehave?

Onthescreenbelow,justshowlistandadd,andjustshowtheeditlinkwhentheusernavigatestothelistpageandclickeditbutton.

IknowthetheoreticalworkingsofngIFbylookingthroughthedocumentation,butinspiteofeverythingthedocumentationdidnotgivemeideasonhowtoresolvethis.

THAT IS MY REPOSITORY