diff --git a/projects/storefrontlib/cms-components/navigation/breadcrumb/breadcrumb.component.html b/projects/storefrontlib/cms-components/navigation/breadcrumb/breadcrumb.component.html
index 576a3a4f0df..c5ae3e72d97 100644
--- a/projects/storefrontlib/cms-components/navigation/breadcrumb/breadcrumb.component.html
+++ b/projects/storefrontlib/cms-components/navigation/breadcrumb/breadcrumb.component.html
@@ -1,10 +1,6 @@
-<nav
-  [attr.aria-label]="'common.breadcrumbs' | cxTranslate"
-  tabindex="-1"
-  *ngIf="crumbs$ | async as crumbList"
->
+<nav [attr.aria-label]="'common.breadcrumbs' | cxTranslate" tabindex="-1">
   <ol [attr.aria-label]="'common.breadcrumbs' | cxTranslate">
-    <li *ngFor="let crumb of crumbList; let i = index; let last = last">
+    <li *ngFor="let crumb of crumbs$ | async; let i = index; let last = last">
       <a
         [routerLink]="crumb.link"
         [innerHTML]="crumb.label"
@@ -15,11 +11,11 @@
               crumb.label +
               (i + 1) +
               ('common.of' | cxTranslate) +
-              crumbList.length
+              (crumbs$ | async)?.length
             : crumb.label +
               (i + 1) +
               ('common.of' | cxTranslate) +
-              crumbList.length
+              (crumbs$ | async)?.length
         "
       ></a>
     </li>