Как реализовать функцию кнопки закрытия в выпадающем списке? - PullRequest
Новая
       4

Как реализовать функцию кнопки закрытия в выпадающем списке?

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

Я недавно начал работать над Angularjs.В моем проекте я использую 'selectize' для заполнения выпадающих списков.Я хочу включить значок «крестик» (X) в каждом доступном раскрывающемся списке.Я искал официальный документ библиотеки 'selectize.js', но не нашел подходящий плагин для этого.Хотя есть некоторые патчи для этого, но они не на должном уровне.

Я пытался искать другие модули, но не нашел ни одного с такой встроенной функцией.Я нашел ниже код, который будет показывать и заполнять выпадающие списки. 

<selectize class="every" ng-disabled="ngReadonly" config="myconfig" options="myOptions" ng-model="myModel"></selectize>

Было бы очень полезно, если бы это было возможно в существующем коде.

Может кто-нибудь Пожалуйста, дайте мне знатьЧто я должен сделать, чтобы сделать то же самое с текущей библиотекой или с любой другой библиотекой?

1 Ответ

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

Вы можете сделать это без какой-либо библиотеки ...

При условии, что у вас есть массив строк 

<select style="display: none" ng-model="myModel" ng-disabled="ngReadonly">
      <option ng-repeat="value for value in options" ng-value="value">
        {{value}}        
      </option>
 </select>
<ul class="my-select" 
     ng-class="{'show': showOpts}"
     ng-disabled="ngReadonly"
     ng-click="showOpts = !showOpts">
    <li ng-repeat="value for value in options"

          ng-click="myModel = value">
        {{value}}<span class="select-x" ng-click="yourClick()">X</span>
    </li>
</ul>

, а затем таблица стилей 

.my-select.show > li {
      display: block;
 }
.my-select > li {
     display: none;
     position: relative;
 }
.select-x {
     position: absolute;
     right: 5px;
     width: 20px;
     height: 20px; /* Adjust depending on your style */
     line-height: 1;
}

ИЛИ С БИБЛИОТЕКОЙ

https://angular -ui.github.io / ui-select /

это мощная директива, которая позволяет вам делать все что угодно.

...