각도 선택 2 국가보기 해당 국가의 국기가있는 드롭 다운

Question

나는 국가의 select2 드롭 다운 목록이 있습니다. 배열과 데이터의 두 키를 연결하지만 텍스트로 국가 플래그를 가져올 수 없습니다. 내 코드는

각도 JS

$scope.select2Config = { 
     formatResult: $scope.format, 
     formatSelection: $scope.format 
    }; 
    $scope.myForm = {}; 
    $scope.myForm.country = [ 
     {id: "IN", name: "INDIA"}, 
     {id: "USA", name: "USA"}, 
     {id: "UK", name: "United Kingdom"} 
    ]; 

    $scope.genName = function (id, name) { 
     return id + ' ' + name; 
    } 

HTML 코드를 다음과 같습니다

<select ng-model="myForm.country" 
    ng-options="obj.id as genName(obj.id,obj.name) for obj in myForm.options"> 
<option value="">Select...</option></select> 

어떻게 내가 내 선택한 옵션에 모두 이미지와 텍스트를받을 수 있나요? 나는 당신이 그것을 참조 할 수있는 동일한 자바 스크립트에서 1 옵션을 본 적이있다 http://jsfiddle.net/Starx/sgb4888k/2/

Answer 1

나는 소스 배열로 ng-model을 설정한다고 생각한다.

angular.module('myApp', []) 
 
    .controller('myCtrl', function($scope) { 
 

 

 
    $scope.select2Config = { 
 
     formatResult: $scope.format, 
 
     formatSelection: $scope.format 
 
    }; 
 
    $scope.myForm = {}; 
 
    $scope.selectedId = ''; 
 
    $scope.myForm.country = [{ 
 
     id: "IN", 
 
     name: "INDIA" 
 
    }, { 
 
     id: "USA", 
 
     name: "USA" 
 
    }, { 
 
     id: "UK", 
 
     name: "United Kingdom" 
 
    }]; 
 

 
    $scope.genName = function(id, name) { 
 
     return id + ' ' + name; 
 
    } 
 

 
    })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app='myApp' data-ng-controller="myCtrl"> 
 

 
    <select ng-model="selectedId" ng-options="obj.id as genName(obj.id,obj.name) for obj in myForm.country"> 
 
    <option value="">Select...</option> 
 
    </select> 
 
    Selected {{selectedId}} 
 

 
</div>