Как настроить выпадающий список? - PullRequest
2 голосов
/ 15 мая 2019

Я использую элементы Infragistics / igx-input-group и igx-раскрывающийся список, чтобы создать раскрывающийся список в моем приложении. Все работает хорошо, и я могу получить данные из API REST просто отлично, но у меня возникают проблемы с отображением выбранного элемента. Несмотря на то, что отображается правильный элемент, нижняя часть обрезается и затрудняет чтение. Поэтому я не уверен, чего мне не хватает, но я ищу способ увеличить размер текстовой области в раскрывающемся списке или уменьшить размер шрифта в существующем поле, чтобы пользователь мог видеть полный выделенный текст.

Вот как это выглядит, а также мой HTML-код на Angular enter image description here

<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>

Ответы [ 2 ]

1 голос
/ 15 мая 2019

Глядя на картинку, текст для неработающих вводов, В процессе , ниже, чем текст в рабочем вводе, 75 .Это может быть проблемой стиля.Я проверил это в StackBlitz с вашим кодом и ввод работает правильно.

0 голосов
/ 22 мая 2019

После еще одного исследования выяснилось, что проблема была в том, как я использовал / создал выпадающий список. Так как предыдущая версия не имела всех необходимых опций, я использовал текстовое поле ig для отображения желаемого значения. В последней версии я теперь могу отображать одно значение и выбирать другое. После перехода к раскрывающемуся списку и удаления текстового поля проблема с выравниванием исчезла.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...