Search code examples
javascriptangularjsangularjs-scope

Bind the Unique values from json array into dropdown in angularjs


Array is this and the unique name: DomicileName

$scope.domicile = {};
$scope.domicile.users = [{
    DomicileName: 'European',
    PortFolioName: 'nternational Select x EM ADR',
    Alias: 'ADR x EM',
    Percentage: 1.0,
    Ticker: 'ADR',
    Category: 'ADRxEM',
    SortOrder: 1
}, {
    DomicileName: 'European',
    PortFolioName: 'International Select x EM ORD',
    Alias: 'Ord x EM',
    Percentage: 4,
    Ticker: 'ORD',
    Category: 'ADRxEM',
    SortOrder: 1
}, {
    DomicileName: 'European',
    PortFolioName: 'International Select with EM ADR',
    Alias: 'ADR w EM',
    Percentage: 4,
    Ticker: 'ADR',
    Category: 'ADRwEM',
    SortOrder: ''
}, {
    DomicileName: 'Developed Market Non-European',
    PortFolioName: 'International Select x EM ADR',
    Alias: 'ADR x EM',
    Percentage: 4,
    Ticker: 'ADR',
    Category: 'ADRxEM',
    SortOrder: 1
}];

Solution

  • angular.module('myApp',[]).controller('MyCtrl', function ($scope) {
        $scope.domicile = {};
        $scope.domicile.users = [{
              DomicileName: 'European',
              PortFolioName: 'nternational Select x EM ADR',
              Alias: 'ADR x EM',
              Percentage: 1.0,
              Ticker: 'ADR',
              Category: 'ADRxEM',
              SortOrder: 1
          }, {
              DomicileName: 'European',
              PortFolioName: 'International Select x EM ORD',
              Alias: 'Ord x EM',
              Percentage: 4,
              Ticker: 'ORD',
              Category: 'ADRxEM',
              SortOrder: 1
          }, {
              DomicileName: 'European',
              PortFolioName: 'International Select with EM ADR',
              Alias: 'ADR w EM',
              Percentage: 4,
              Ticker: 'ADR',
              Category: 'ADRwEM',
              SortOrder: ''
          }, {
              DomicileName: 'Developed Market Non-European',
              PortFolioName: 'International Select x EM ADR',
              Alias: 'ADR x EM',
              Percentage: 4,
              Ticker: 'ADR',
              Category: 'ADRxEM',
              SortOrder: 1
          }];
          
          _init();
          
          function _init() {
          	$scope.domicile.users = _uniq($scope.domicile.users, 'DomicileName')
          }
          
          function _uniq(array, property){
           	var flags = [], output = [], l = array.length, i;
            for( i=0; i<l; i++) {
                if( flags[array[i][property]]) continue;
                flags[array[i][property]] = true;
                output.push(array[i]);
            }
            return output;
          }
    });
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
    <div ng-app="myApp">
      <div ng-controller="MyCtrl">
        <select>
          <option ng-repeat="user in domicile.users">{{ user.DomicileName }}</option>
        </select>
      </div>
    </div>