ngOptions seleccionado todas las opciones por defecto y la desaparición de las opciones a seleccionar

StackOverflow https://stackoverflow.com//questions/22018732

Pregunta

Tengo un extraño problema me parece que no puede solucionar los problemas con mi punto de vista.Estoy usando una directiva que genera un treeview de mi sitio web.Cuando seleccione un sitio, tengo dos cuadros de selección que llenar con los grupos en un solo sitio, y las listas en el sitio.Cuando las opciones de rellenar, todos ellos son seleccionados.He inspeccionado los elementos y todos ellos tienen option="selected" Extraño es que, cuando hago clic en una opción única, de todos los demás desaparecen y sólo la opción seleccionada permanece.He comprobado la fuente en Chrome consola y sí sólo la selección de la opción de la etiqueta sigue siendo.

enter image description here

Por ejemplo las Listas de sitios de la casilla tiene varias opciones, pero cuando hice clic en documentos Antiguos que otros, todos desaparecieron.En el Sitio de los Grupos, todos los grupos que ya están seleccionados Ctrl:

spApp.controller('sitesCtrl',
    function sitesCtrl($scope, $q, $modal, UserService, GroupService, SiteService){
        //Options for tree controller directive
        $scope.treeOptions = {
            nodeChildren: "children",
            dirSelectable: true,
            injectClasses: {
                ul: "a1",
                li: "a2",
                liSelected: "a7",
                iExpanded: "a3",
                iCollapsed: "a4",
                iLeaf: "a5",
                label: "a6",
                labelSelected: "a8"
            }
        }

        //Returns siteMap for tree controller directive 
        $scope.siteMap = SiteService.getSiteMap();

        //Returns selected sites information: grous, lists, title, url
        $scope.showSelected = function(site){
            var siteData = SiteService.getSiteInfo(site);
            //sets sites title and url in view
            $scope.site = site;
            $scope.siteGroups = siteData.groups;
            $scope.siteLists = siteData.lists;
        }

    }
);

Vista:

    <div class="siteGroups">
        <label for="siteGroups">Site Groups</label>
        <select 
            multiple
            name="siteGroups" 
            id="siteGroups" 
            class="siteGroups"
            ng-model="siteGroups"
            ng-options="g.name for g in siteGroups">
        </select>
    </div>
        <div class="btm1 animated fadeInUp">
        <label for="siteLists">Site Lists </label>
        <select multiple
            id="siteLists" 
            ng-model="siteLists"
            ng-options="l.title for l in siteLists">
        </select>
    </div>

De servicio y más de la vista

¿Fue útil?

Solución

Esto está sucediendo porque el ngOptions en las listas de selección se limita a la misma matriz como la ngModel. ngModel debe ser una de las diferentes matriz que contiene sólo los valores seleccionados.

Con siteGroups como un ejemplo, lo que sucede es que la lista de selección opciones se inicializan con siteGroups, y todos ellos son seleccionados debido a que los artículos están en el ngModel (también el siteGroups de la matriz).Cuando haga clic en uno de ellos, ahora elimina todos los demás elementos de ngModel excepto el que se hace clic sobre.Desde ngOptions está delimitado a la misma lista, todos los no seleccionados opciones a desaparecer también.

Para solucionar este problema, crear separado de la matriz de propiedades en su ámbito de aplicación para los valores seleccionados en cada lista.

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top