J'ai utilisé Bootstrap Multiselect Dropdown http://davidstz.github.io/bootstrap-multiselect/ et incorporer dans Le sous-modèle de AngularJs & Laissez-le exécuter avec la fonction suivante:
<select id="example27" multiple="multiple">
<option ng-repeat="list in lists" value="{{list.id}}">{{list.name}}</option>
</select>
4 Réponses :
Vous pouvez essayer de jeter un oeil sur le problème, https://github.com / DavidSutz / Bootstrap-multisélection / numéros / 128 et le JS Fiddle,
3 commentaires
Votre solution travaille sur Chrome pour moi mais pas avec Firefox: /
@ user2598687 Si je pouvais uppoter dix fois, je le ferais. Merci notamment pour le violon, pour moi, cela est tombé à certaines versions de Bootstrap et de Bootstrap-UI.
@toreGua est correct, il ne "cocher" pas les éléments sélectionnés de Firefox (dernière version). Y at-il un travail autour?
Si vous utilisez Bootstrap-Multiselect, vous devez utiliser l'attribut NG-Options, comme dans @ user2598687 réponse. Voici la version de Fiddle qui fonctionne avec Firefox: Cliquez avec Jsfiddle
<select class="multiselect" data-placeholder="Select Products"
ng-model="productSelection" ng-options="item.id as item.name for item in Products"
multiple="multiple" multiselect-dropdown >
$scope.Products = [{id:1,name:"Apple"}, {id:2,name:"Banana"}, {id:3,name:"Carrort"}, {id:4,name:"Dart"}];
Vérifié que cela fonctionne à la fois de Firefox et de Chrome sous Gnome / Mint 14 et quelle que soit la version de Windows à utiliser au travail.
Je viens de traiter ce problème !! Au lieu d'essayer d'utiliser NG-REPEAT, vous pouvez ajouter des options de manière dynamique avec quelque chose comme ceci:
var topicSelect = document.getElementById("topic-select");
for (topic in scope.topicList) {
topicSelect.add(new Option(scope.topicList[topic], scope.topicList[topic]));
}
Je cherche moi-même une liste de tâches multiservices. J'ai mûpé à travailler cette solution moi-même en utilisant Long2know. J'ai même eu le multisélectionne dans un UI modal, qui était mon objectif initial.
Où avez-vous écrit le code pour regarder
$ ViewContentOached ? Dans votre contrôleur ou est-ce dans une directive?Je l'ai écrit dans le contrôleur. Paste.laravel.com/v5k . Ça a marché. Mais lors de la répétition de NG-NG (voir la section), la répétition NG est désactivée. Tks @callmekatootie
Pourquoi ne déplacez-vous pas le code dans une directive? AFAIK, la manipulation DOM basée sur JQuery doit être strictement tenue de sortir des contrôleurs. docs.angularjs.org/misc/faq#commonpiesfalls - Cette section le décrit en détail . Déplacez le code du contrôleur vers une directive, puis essayez. Aussi, avez-vous essayé de mettre le code ci-dessus à l'intérieur de
$ de portée. $ Appliquer () ?@CallmekatooOtie Il semble être difficile de déménager à la directive: |
Veuillez sélectionner la réponse pour votre question. Je cherche la solution pour cette question.
Checkout: Coques de contrôle multisélectable-Dropdown-UTIL-Angular-JS