error on replacing the layout of RoutesComponent in abp framework

Question

I followed the instruction below to replace the layout of RoutesComponent.
https://docs.abp.io/en/abp/latest/UI/Angular/Component-Replacement#how-to-replace-a-layout
I got the error when adding li element. Anyone knows how to fix it? Thanks
 <li
    #navbarRootDropdown
    [abpVisibility]="routeContainer"
    class="nav-item dropdown"
    display="static"
    (click)="
      navbarRootDropdown.expand
        ? (navbarRootDropdown.expand = false)
        : (navbarRootDropdown.expand = true)
    "
  >

Error: src/app/routes/routes.component.html:10:5 - error NG8002: Can't bind to 'abpVisibility' since it isn't a known property of 'li'. 10 [abpVisibility]="routeContainer"

src/app/routes/routes.component.ts:5:16 5 templateUrl: './routes.component.html', ~~~~~~~~~~~~~~~~~~~~~~~~~ Error occurs in the template of component RoutesComponent.

Error: src/app/routes/routes.component.html:10:22 - error TS2339: Property 'routeContainer' does not exist on type 'RoutesComponent'.

10     [abpVisibility]="routeContainer"
                        ~~~~~~~~~~~~~~

  src/app/routes/routes.component.ts:5:16
    5   templateUrl: './routes.component.html',
                     ~~~~~~~~~~~~~~~~~~~~~~~~~
    Error occurs in the template of component RoutesComponent.