mirror of
https://dev.azure.com/hugendubel/ISA/_git/ISA-Frontend
synced 2025-12-28 22:42:11 +01:00
select inputs können gecleart werden
This commit is contained in:
@@ -1,6 +1,9 @@
|
||||
<div class="shared-select-toggle" [class.has-value]="hasValue" [class.is-open]="isOpen" (click)="toggle()">
|
||||
<span class="shared-select-display-value truncate">{{ displayValue }}</span>
|
||||
<shared-icon class="shared-select-arrow" [icon]="!isOpen ? 'arrow-drop-down' : 'arrow-drop-up'"></shared-icon>
|
||||
<div class="grid grid-flow-col gap-2">
|
||||
<shared-icon class="shared-select-arrow" [icon]="!isOpen ? 'arrow-drop-down' : 'arrow-drop-up'"></shared-icon>
|
||||
<shared-icon *ngIf="clearableEnabled && value" class="shared-select-clear" icon="close" (click)="setValue(clearValue)"></shared-icon>
|
||||
</div>
|
||||
</div>
|
||||
<div class="shared-select-options-outlet">
|
||||
<div class="shared-select-options" [class.is-open]="isOpen" [class.force-close]="forceClose">
|
||||
|
||||
@@ -21,6 +21,7 @@ import { IconComponent } from '@shared/components/icon';
|
||||
import { BaseFormControlDirective } from '@shared/components/form-control';
|
||||
import { Subject } from 'rxjs';
|
||||
import { takeUntil } from 'rxjs/operators';
|
||||
import { NgIf } from '@angular/common';
|
||||
|
||||
@Component({
|
||||
selector: 'shared-select',
|
||||
@@ -30,7 +31,7 @@ import { takeUntil } from 'rxjs/operators';
|
||||
encapsulation: ViewEncapsulation.None,
|
||||
host: { class: 'shared-select' },
|
||||
standalone: true,
|
||||
imports: [IconComponent],
|
||||
imports: [IconComponent, NgIf],
|
||||
providers: [{ provide: NG_VALUE_ACCESSOR, useExisting: SelectComponent, multi: true }],
|
||||
})
|
||||
export class SelectComponent<T = any> extends BaseFormControlDirective implements ControlValueAccessor, AfterContentInit, OnDestroy {
|
||||
@@ -51,6 +52,16 @@ export class SelectComponent<T = any> extends BaseFormControlDirective implement
|
||||
@Input()
|
||||
placeholder: string;
|
||||
|
||||
@Input()
|
||||
clearable: BooleanInput = true;
|
||||
|
||||
get clearableEnabled(): boolean {
|
||||
return coerceBooleanProperty(this.clearable);
|
||||
}
|
||||
|
||||
@Input()
|
||||
clearValue: T = undefined;
|
||||
|
||||
@Input()
|
||||
@HostBinding('tabindex')
|
||||
tabindex: NumberInput = 0;
|
||||
|
||||
Reference in New Issue
Block a user