diff --git a/npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html b/npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
index fa0ee93d1a..59fa3f4199 100644
--- a/npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
+++ b/npm/ng-packs/packages/identity/src/lib/components/roles/roles.component.html
@@ -6,7 +6,7 @@
       </div>
       <div class="text-right col col-md-6">
         <button
-          [abpPermission]="'AbpIdentity.Roles.Create'"
+          *abpPermission="'AbpIdentity.Roles.Create'"
           id="create-role"
           class="btn btn-primary"
           type="button"
@@ -73,18 +73,18 @@
                 <i class="fa fa-cog mr-1"></i>{{ 'AbpIdentity::Actions' | abpLocalization }}
               </button>
               <div ngbDropdownMenu>
-                <button [abpPermission]="'AbpIdentity.Roles.Update'" ngbDropdownItem (click)="edit(data.id)">
+                <button *abpPermission="'AbpIdentity.Roles.Update'" ngbDropdownItem (click)="edit(data.id)">
                   {{ 'AbpIdentity::Edit' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpIdentity.Roles.ManagePermissions'"
+                  *abpPermission="'AbpIdentity.Roles.ManagePermissions'"
                   ngbDropdownItem
                   (click)="providerKey = data.name; visiblePermissions = true"
                 >
                   {{ 'AbpIdentity::Permissions' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpIdentity.Roles.Delete'"
+                  *abpPermission="'AbpIdentity.Roles.Delete'"
                   ngbDropdownItem
                   (click)="delete(data.id, data.name)"
                 >
diff --git a/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html b/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
index 92e7dd5773..41d8244697 100644
--- a/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
+++ b/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
@@ -6,7 +6,7 @@
       </div>
       <div class="text-right col col-md-6">
         <button
-          [abpPermission]="'AbpIdentity.Users.Create'"
+          *abpPermission="'AbpIdentity.Users.Create'"
           id="create-role"
           class="btn btn-primary"
           type="button"
@@ -86,18 +86,18 @@
                 <i class="fa fa-cog mr-1"></i>{{ 'AbpIdentity::Actions' | abpLocalization }}
               </button>
               <div ngbDropdownMenu>
-                <button [abpPermission]="'AbpIdentity.Users.Update'" ngbDropdownItem (click)="edit(data.id)">
+                <button *abpPermission="'AbpIdentity.Users.Update'" ngbDropdownItem (click)="edit(data.id)">
                   {{ 'AbpIdentity::Edit' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpIdentity.Users.ManagePermissions'"
+                  *abpPermission="'AbpIdentity.Users.ManagePermissions'"
                   ngbDropdownItem
                   (click)="providerKey = data.id; visiblePermissions = true"
                 >
                   {{ 'AbpIdentity::Permissions' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpIdentity.Users.Delete'"
+                  *abpPermission="'AbpIdentity.Users.Delete'"
                   ngbDropdownItem
                   (click)="delete(data.id, data.userName)"
                 >
diff --git a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
index 4396f48d89..b465324501 100644
--- a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
+++ b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
@@ -6,7 +6,7 @@
       </div>
       <div class="text-right col col-md-6">
         <button
-          [abpPermission]="'AbpTenantManagement.Tenants.Create'"
+          *abpPermission="'AbpTenantManagement.Tenants.Create'"
           id="create-tenants"
           class="btn btn-primary"
           type="button"
@@ -79,28 +79,28 @@
               </button>
               <div ngbDropdownMenu>
                 <button
-                  [abpPermission]="'AbpTenantManagement.Tenants.Update'"
+                  *abpPermission="'AbpTenantManagement.Tenants.Update'"
                   ngbDropdownItem
                   (click)="editTenant(data.id)"
                 >
                   {{ 'AbpTenantManagement::Edit' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpTenantManagement.Tenants.ManageConnectionStrings'"
+                  *abpPermission="'AbpTenantManagement.Tenants.ManageConnectionStrings'"
                   ngbDropdownItem
                   (click)="onEditConnectionString(data.id)"
                 >
                   {{ 'AbpTenantManagement::Permission:ManageConnectionStrings' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpTenantManagement.Tenants.ManageFeatures'"
+                  *abpPermission="'AbpTenantManagement.Tenants.ManageFeatures'"
                   ngbDropdownItem
                   (click)="providerKey = data.id; visibleFeatures = true"
                 >
                   {{ 'AbpTenantManagement::Permission:ManageFeatures' | abpLocalization }}
                 </button>
                 <button
-                  [abpPermission]="'AbpTenantManagement.Tenants.Delete'"
+                  *abpPermission="'AbpTenantManagement.Tenants.Delete'"
                   ngbDropdownItem
                   (click)="delete(data.id, data.name)"
                 >
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
index 3046313407..0e7032bba1 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
@@ -32,7 +32,7 @@
           </ng-container>
 
           <ng-template #defaultLink let-route>
-            <li class="nav-item" [abpPermission]="route.requiredPolicy">
+            <li class="nav-item" *abpPermission="route.requiredPolicy">
               <a class="nav-link" [routerLink]="[route.url]"
                 ><i *ngIf="route.iconClass" [ngClass]="route.iconClass"></i> {{ route.name | abpLocalization }}</a
               >
@@ -42,7 +42,7 @@
           <ng-template #dropdownLink let-route>
             <li
               #navbarRootDropdown
-              [abpPermission]="route.requiredPolicy"
+              *abpPermission="route.requiredPolicy"
               [abpVisibility]="routeContainer"
               class="nav-item dropdown"
               display="static"
@@ -86,7 +86,7 @@
           </ng-template>
 
           <ng-template #defaultChild let-child>
-            <div class="dropdown-submenu" [abpPermission]="child.requiredPolicy">
+            <div class="dropdown-submenu" *abpPermission="child.requiredPolicy">
               <a class="dropdown-item" [routerLink]="[child.url]">
                 <i *ngIf="child.iconClass" [ngClass]="child.iconClass"></i>
                 {{ child.name | abpLocalization }}</a
@@ -103,7 +103,7 @@
               [display]="isDropdownChildDynamic ? 'dynamic' : 'static'"
               placement="right-top"
               [autoClose]="true"
-              [abpPermission]="child.requiredPolicy"
+              *abpPermission="child.requiredPolicy"
               (openChange)="openChange($event, childrenContainer)"
             >
               <div ngbDropdownToggle [class.dropdown-toggle]="false">