ngOptions выбрал все параметры по умолчанию и исчезающие параметры при выборе

У меня странная проблема, которую я не могу решить с помощью моего представления. Я использую директиву, которая создает древовидное представление моего сайта. Когда я выбираю один сайт, у меня есть два поля выбора, которые заполняются группами на одном сайте и списками на сайте. Когда параметры заполняются, все они выбраны. Я проверил элементы, и все они имеют option="selected". Странно то, что когда я нажимаю на один параметр, все остальные исчезают, и остается только выбранный вариант. Я проверил источник в консоли Chrome, и да, остался только тег выбранного параметра.

введите здесь описание изображения

Например, в поле выбора «Списки сайтов» есть несколько вариантов, но когда я щелкнул «Старые документы», все остальные исчезли. В Группах сайта уже выбраны все группы 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;
        }

    }
);

Вид:

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

Сервис и многое другое


person Batman    schedule 25.02.2014    source источник


Ответы (1)


Это происходит потому, что ngOptions в списках выбора ограничены тем же массивом, что и ngModel. ngModel должен быть другим массивом, содержащим только выбранные значения.

Например, с siteGroups происходит то, что опции списка выбора инициализируются с siteGroups, и все они выбраны, потому что элементы находятся в ngModel (также в массиве siteGroups). Когда вы нажимаете на один из них, он удаляет все остальные элементы из ngModel, кроме того, на который вы нажали. Поскольку ngOptions привязан к тому же списку, все невыбранные опции также исчезают.

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

person Anthony Chu    schedule 25.02.2014
comment
Да, ты прав. Я изменил ngModel, и он отлично сработал. - person Batman; 25.02.2014