2017-08-15 6 views
-1

私は複数選択しています。私は2つの異なる2つの配列を持っています。選択した値が複数選択されています。AngularJS ng-selected issue

アレイからng-repeat idを検索したい場合は、それが真になり、値が選択された状態になります。

マイAngularJSコード

<script> 
     var app = angular.module('myApp', []); 
    app.controller('MainCtrl', function($scope, $http) { 

     $scope.name = "John Brad"; 

     $scope.important_selection = { 
        "error": false, 
        "client_data": { 
        "important": [ 
         { 
          "id": 10, 
          "name": "Socially Responsible" 
         }, 
         { 
          "id": 8, 
          "name": "LBGT" 
         }, 
         { 
          "id": 4, 
          "name": "Education" 
         }, 
         { 
          "id": 2, 
          "name": "Retirement" 
         } 
        ] 
       }, 
       "status_code": 200 
       }; 

    $scope.importants_series = { 
       "error": false, 
       "important": [ 
        { 
         "id": 1, 
         "name": "Investment" 
        }, 
        { 
         "id": 2, 
         "name": "Retirement" 
        }, 
        { 
         "id": 3, 
         "name": "Insurance" 
        }, 
        { 
         "id": 4, 
         "name": "Education" 
        }, 
        { 
         "id": 5, 
         "name": "Tax" 
        }, 
        { 
         "id": 6, 
         "name": "Estate" 
        }, 
        { 
         "id": 7, 
         "name": "Business" 
        }, 
        { 
         "id": 8, 
         "name": "LBGT" 
        }, 
        { 
         "id": 9, 
         "name": "Offshore" 
        }, 
        { 
         "id": 10, 
         "name": "Socially Responsible" 
        }, 
        { 
         "id": 11, 
         "name": "Divorce" 
        } 
       ], 
       "status_code": 200 
      };   
    }); 
    </script> 

私のHTMLコード

<select name="important[]" class="form-control" multiple="" required> 
     <option ng-selected="important_selection.important.find(item => item.id === important.id)" ng-repeat="important in importants_series.important" value="{{important.id}}">{{important.name}}</option> 
    </select> 

今私は、配列内のIDを検索するとtrueの場合、それが選択されます。 私はng-selected

Plunker Link for more detailsで問題があります。https://plnkr.co/edit/BUnUNqr0IevJ5BkslZNM?p=preview

をすべてのヘルプは感謝を鑑賞されます。

答えて

1

データバインディングを容易にするために、ng-optionsng-modelselectに使用する必要があります。オブジェクト参照の平等のための

<select name="important[]" class="form-control" multiple="" required 
    ng-options="important.name for important in importants_series.important" 
    ng-model="important_selection.client_data.important"></select> 

残念ながらng-modelのみをチェックし、私たちは、選択配列自体

var oldArray = $scope.important_selection.client_data.important; 

    $scope.important_selection.client_data.important = []; 

    oldArray.forEach(function(item) { 
    var refItem = $scope.importants_series.important.find(function(i) { 
     return i.id == item.id; 
    }); 

    $scope.important_selection.client_data.important.push(refItem); 
    }); 

それとも、代わりに新しい配列に割り当てることができますからデータを再割り当てする追加のステップを必要としています。

Working plunker