diff --git a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.spec.ts b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.spec.ts index 68cf4e053a..7851ed2558 100644 --- a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.spec.ts +++ b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.spec.ts @@ -32,6 +32,7 @@ describe('CardViewSelectItemComponent', () => { let overlayContainer: OverlayContainer; let appConfig: AppConfigService; const mockData = [{ key: 'one', label: 'One' }, { key: 'two', label: 'Two' }, { key: 'three', label: 'Three' }]; + const mockDataNumber = [{ key: 1, label: 'One' }, { key: 2, label: 'Two' }, { key: 3, label: 'Three' }]; const mockDefaultProps = { label: 'Select box label', value: 'two', @@ -39,6 +40,13 @@ describe('CardViewSelectItemComponent', () => { key: 'key', editable: true }; + const mockDefaultNumbersProps = { + label: 'Select box label', + value: 2, + options$: of(mockDataNumber), + key: 'key', + editable: true + }; setupTestBed({ imports: [ @@ -108,6 +116,30 @@ describe('CardViewSelectItemComponent', () => { expect(component.value).toEqual('one'); }); + it('should be possible edit selectBox item with numbers', () => { + component.property = new CardViewSelectItemModel({ + ...mockDefaultNumbersProps, + editable: true + }); + component.editable = true; + component.displayNoneOption = true; + component.ngOnChanges(); + fixture.detectChanges(); + + expect(component.value).toEqual(2); + expect(component.isEditable()).toBe(true); + const selectBox = fixture.debugElement.query(By.css('.mat-select-trigger')); + selectBox.triggerEventHandler('click', {}); + + fixture.detectChanges(); + const optionsElement = Array.from(overlayContainer.getContainerElement().querySelectorAll('mat-option')); + expect(optionsElement.length).toEqual(4); + optionsElement[1].dispatchEvent(new Event('click')); + fixture.detectChanges(); + + expect(component.value).toEqual(1); + }); + it('should be able to enable None option', () => { component.property = new CardViewSelectItemModel({ ...mockDefaultProps, diff --git a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.ts b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.ts index 04c2988bf0..bb490cfadc 100644 --- a/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.ts +++ b/lib/core/card-view/components/card-view-selectitem/card-view-selectitem.component.ts @@ -30,12 +30,12 @@ import { takeUntil, map } from 'rxjs/operators'; templateUrl: './card-view-selectitem.component.html', styleUrls: ['./card-view-selectitem.component.scss'] }) -export class CardViewSelectItemComponent extends BaseCardView> implements OnChanges, OnDestroy { +export class CardViewSelectItemComponent extends BaseCardView> implements OnChanges, OnDestroy { static HIDE_FILTER_LIMIT = 5; @Input() editable: boolean = false; - @Input() options$: Observable[]>; + @Input() options$: Observable[]>; @Input() displayNoneOption: boolean = true; @@ -43,7 +43,7 @@ export class CardViewSelectItemComponent extends BaseCardView[]> { + getOptions(): Observable[]> { return this.options$ || this.property.options$; } diff --git a/lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts b/lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts index ba5cfef98c..8cf6af296f 100644 --- a/lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts +++ b/lib/core/card-view/interfaces/card-view-selectitem-properties.interface.ts @@ -24,6 +24,6 @@ export interface CardViewSelectItemOption { } export interface CardViewSelectItemProperties extends CardViewItemProperties { - value: string; + value: string | number; options$: Observable[]>; }