ngOptions는 기본적으로 모든 옵션을 선택하고 선택 시 옵션이 사라집니다.

Question

내 견해로는 문제를 해결할 수 없는 이상한 문제가 있습니다.내 웹사이트의 트리뷰를 생성하는 지시어를 사용하고 있습니다.하나의 사이트를 선택하면 한 사이트의 그룹과 사이트의 목록으로 채워지는 두 개의 선택 상자가 있습니다.옵션이 채워지면 모두 선택됩니다.요소를 검사했는데 모두 그렇습니다. 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>

서비스 및 그 이상의 전망

Answer 1

이런 일이 일어나는 이유는 ngOptions 선택 목록의 항목은 ngModel. ngModel 선택한 값만 보유하는 다른 배열이어야 합니다.

와 함께 siteGroups 예를 들어, 무슨 일이 일어나고 있는지는 선택 목록 옵션이 다음과 같이 초기화된다는 것입니다. siteGroups, 이며 항목이 ngModel (또한 siteGroups 정렬).그 중 하나를 클릭하면 이제 다른 모든 항목이 제거됩니다. ngModel 당신이 클릭한 것을 제외하고요.부터 ngOptions 동일한 목록에 묶여 있으면 선택하지 않은 모든 옵션도 사라집니다.

이 문제를 해결하려면 각 목록에서 선택한 값에 대해 범위에 별도의 배열 속성을 만듭니다.