Forums Ignite UI for Angular
Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
Close
Tom Miller
65
Having issues with Text being cut of in drop down box
posted

I was wondering if someone can point out what i am doing wrong or missing as when i use the drop down box which uses rest api on

backed to get its data (which works fine as expected ) cuts off the bttn of the Display text or acts wired.

Any idea how to fix this ?

Parents
  • 65
    Offline posted 

    Here is the Code i am using to create the DropDown

    <form novalidate [formGroup]="form">
    <igx-input-group #inputGroup class="input-group" [igxToggleAction]="dropDown">
        <input #input class="input"
               type="text"
               igxInput
               [igxDropDownItemNavigation]="igxDropDown"
               readonly= "true"
               placeholder="{{placeholder}}"
               formControlName="selected"
               (keydown.ArrowDown)="openDropDown()"/>
        <label *ngIf="label && label.length" igxLabel>{{label}}</label>

        <igx-suffix igxButton="icon"
                    class="dropdownToggleButton"
                    igxRipple>
            <igx-icon *ngIf="igxDropDown.collapsed; else toggleUp" fontSet="material">arrow_drop_down</igx-icon>
            <ng-template #toggleUp>
                <igx-icon fontSet="material">arrow_drop_up</igx-icon>
            </ng-template>
        </igx-suffix>
    </igx-input-group>

    <igx-drop-down #dropDown (onSelection)="onSelection($event)">
        <igx-drop-down-item *ngFor="let option of options"
                            [value]="option.value"
                            [isSelected]="option.name === selected.value">
            {{ option.name }}
        </igx-drop-down-item>
    </igx-drop-down>

</form>
  • 21795
    Offline posted in reply to Tom Miller

    Hello Tom,

    Looking at the pictures you provided this looks like an issue in our input component. Using the code you provide I have created small sample in StackBlitz here. I was not able to reproduce the issue you are showing in my sample. Can you try to modify my sample and reproduce this issue so I can investigate it further?

    Looking forward to your reply and sample provided.

Reply Children