NGOPTIONSはデフォルトですべてのオプションを選択し、選択時のオプションの消えます。

Question

私は私の見解でトラブルシューティングすることができない奇妙な問題を抱えています。私は私のウェブサイトのツリービューを生成する指令を使っています。 1つのサイトを選択すると、1つのサイト内のグループとサイトのリストになる2つの選択ボックスがあります。オプションが入力されると、それらすべてが選択されています。私は要素を検査しました、そして、それらすべてが一般的なオプションをクリックすると、他のすべてのオプションが消え、選択したオプションのみが残っているということです。 Chrome Consoleでソースを確認し、YEA選択したオプションタグは残ります。

Exmlerのサイトリスト選択ボックスには複数のオプションがありますが、古い文書をクリックすると、他のユーザーはすべて消えました。サイトグループでは、すべてのグループがすでに選択されています 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>

.

real="nofollownoreferrer">サービスなど

Answer 1

Selectリスト内のngOptionsがngModelと同じ配列に囲まれているため、これは起こります。ngModelは、選択した値のみを保持する別の配列である必要があります。

例としてsiteGroupsを使用すると、SELECT LISTオプションがsiteGroupsで初期化されることです。項目がngModel（siteGroupsアレイ）にあるため、すべて選択されます。そのうちの1つをクリックすると、クリックしたものを除いて、ngModelから他のすべての項目を削除します。ngOptionsは同じリストに囲まれているので、選択されていないオプションはすべて消えます。

これを修正するには、各リストの選択した値の範囲に別々の配列プロパティを作成します。