mirror of
https://github.com/richard-loafle/fuse-angular.git
synced 2026-03-09 17:08:41 +00:00
9005f08ac7
(layouts) Common components of layouts now requests their data directly from their service rather than getting it from route data (core) New navigation service to request and store the navigation data
36 lines
1.1 KiB
HTML
36 lines
1.1 KiB
HTML
<!-- Button -->
|
|
<button
|
|
mat-icon-button
|
|
[matMenuTriggerFor]="languages">
|
|
<ng-container *ngTemplateOutlet="flagImage; context: {$implicit: activeLang}"></ng-container>
|
|
</button>
|
|
|
|
<!-- Language menu -->
|
|
<mat-menu
|
|
[xPosition]="'before'"
|
|
#languages="matMenu">
|
|
<ng-container *ngFor="let lang of availableLangs; trackBy: trackByFn">
|
|
<button
|
|
mat-menu-item
|
|
(click)="setActiveLang(lang.id)">
|
|
<span class="flex items-center">
|
|
<ng-container *ngTemplateOutlet="flagImage; context: {$implicit: lang.id}"></ng-container>
|
|
<span class="ml-3">{{lang.label}}</span>
|
|
</span>
|
|
</button>
|
|
</ng-container>
|
|
</mat-menu>
|
|
|
|
<!-- Flag image template -->
|
|
<ng-template
|
|
let-lang
|
|
#flagImage>
|
|
<span class="relative w-6 shadow rounded-sm overflow-hidden">
|
|
<span class="absolute inset-0 ring-1 ring-inset ring-black ring-opacity-10"></span>
|
|
<img
|
|
class="w-full"
|
|
[src]="'assets/images/flags/' + flagCodes[lang].toUpperCase() + '.svg'"
|
|
[alt]="'Flag image for ' + lang">
|
|
</span>
|
|
</ng-template>
|