projects/commons/src/lib/elements/lang-picker/components/lang-picker.component.ts
| selector | cmn-lang-picker |
| styleUrls | ./lang-picker.component.scss |
| templateUrl | ./lang-picker.component.html |
Properties |
Methods |
| Public ngOnInit |
ngOnInit()
|
|
Returns :
void
|
| Public onSelect | ||||||
onSelect(lang: ILangPicker)
|
||||||
|
Parameters :
Returns :
void
|
| Public langs |
Type : ILangPicker[]
|
Default value : [
{id: 'en', label: 'english'},
{id: 'es', label: 'spanish', isActive: true},
]
|
| Public value |
Type : string
|
import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { ILangPicker } from '../interfaces';
@Component({
selector: 'cmn-lang-picker',
templateUrl: './lang-picker.component.html',
styleUrls: [ './lang-picker.component.scss' ],
})
export class LangPickerComponent implements OnInit {
public value: string;
public langs: ILangPicker[] = [
{id: 'en', label: 'english'},
{id: 'es', label: 'spanish', isActive: true},
];
public ngOnInit(): void {
this.value = this.langs.find((lang) => lang.isActive).id;
}
public onSelect(lang: ILangPicker) {
this.value = lang.id;
}
}
<cmn-dropdown [label]="value"
[hasBorder]="false">
<ng-container *ngFor="let lang of langs">
<a class="dropdown-item"
(click)="onSelect(lang)">
{{ lang.id }}
</a>
</ng-container>
</cmn-dropdown>
./lang-picker.component.scss
::ng-deep {
.dropdown-trigger {
.button {
border: none;
}
}
}