<abp-page [title]="'AbpIdentity::Roles' | abpLocalization" [toolbar]="data.items"> <div id="identity-roles-wrapper" class="card"> <div class="card-body"> <abp-extensible-table [data]="data.items" [recordsTotal]="data.totalCount" [list]="list" ></abp-extensible-table> </div> </div>
<abp-modal [(visible)]="isModalVisible" [busy]="modalBusy"> <ng-template #abpHeader> <h3>{{ (selected?.id ? 'AbpIdentity::Edit' : 'AbpIdentity::NewRole') | abpLocalization }}</h3> </ng-template>
<ng-template #abpBody>
<form [formGroup]="form" (ngSubmit)="save()" [validateOnSubmit]="true">
<abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
</form>
</ng-template>
<ng-template #abpFooter>
<button type="button" class="btn btn-outline-primary" abpClose>
{{ 'AbpIdentity::Cancel' | abpLocalization }}
</button>
<abp-button iconClass="fa fa-check" [disabled]="form?.invalid" (click)="save()">{{
'AbpIdentity::Save' | abpLocalization
}}</abp-button>
</ng-template>
</abp-modal>
<abp-permission-management #abpPermissionManagement="abpPermissionManagement" *abpReplaceableTemplate=" { inputs: { providerName: { value: 'R' }, providerKey: { value: providerKey }, visible: { value: visiblePermissions, twoWay: true }, hideBadges: { value: true } }, outputs: { visibleChange: onVisiblePermissionChange }, componentKey: permissionManagementKey }; let init = initTemplate " (abpInit)="init(abpPermissionManagement)" > </abp-permission-management> </abp-page>
Can't bind to 'abpReplaceableTemplate' since it isn't a known property of 'abp-permission-management' (used in the 'RolesManagementComponent' component template).
How to customize the user management UI
how to get PageToolbarComponent source code