Как установить ширину выпадающего списка в модуле typeahead

Я пытался понять, как я могу установить раскрывающийся список в модуле Typeahead так, чтобы он имел ту же ширину, что и входной текст, и не менялся динамически в зависимости от ширины содержимого в раскрывающемся списке. Я использую 1.0.0-alpha.15 ng-bootstrap.


ng-bootstrap angular-ui-bootstrap
person zakSyed    schedule 27.12.2016    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Просто добавьте ширину в раскрывающийся шаблон

Из

<template #rt let-r="result" let-t="term">
    <img [src]="'https://upload.wikimedia.org/wikipedia/commons/thumb/' + r.flag" width="16">
    {{ r.name}}
</template>

To

<template #rt let-r="result" let-t="term">
    <div style="width: 350px;">
        <img [src]="'https://upload.wikimedia.org/wikipedia/commons/thumb/' + r.flag" width="16">
        {{ r.name}}
    </div>
</template>

Plunk

как я могу установить раскрывающийся список в модуле Typeahead так, чтобы он имел ту же ширину, что и вводимый текст

Вероятно, это было бы плохой идеей, имхо, но если вам не нужна статическая ширина, вы можете рассчитать ширина входной строки и вместо этого используйте NgStyle.

person svarog    schedule 27.12.2016