AngularJS ng-bind 값을 대문자 또는 소문자로 변경하지 않고 동적 선택 드롭 다운에 대문자 사용 안 함

Question

AngularJS를 사용하여 동적 선택 드롭 다운에 ng 모델의 대/소문자를 구분하지 않고 바인드하려고합니다. 흐름을 스택에서 다양한 relavent 답변을 통해 이동하여

은, 내가보기에 다음과 같은 때우기, 여기 CASEINSENSITIVE - 옵션 i는 다음과 같은 솔루션

AngularJS case-insensitive binding to a static select drop-down를 참조 때우기 지시어와는

HTML :

<select id="dcName" caseinsensitive-options="" ng-model="DC.name" class="form-control"> 
    <option value="">--- Please Select ---</option> 
    <option ng-repeat="dataCenter in inventoryDataCenters" value="{{dataCenter}}">{{dataCenter}}</option> 
</select> 

JS 지시어 코드 :

app.directive('caseinsensitiveOptions', function() { 
    return { 
     restrict: 'A', 
     require: ['ngModel', 'select'], 
     link: function(scope, el, attrs, ctrls) { 
      var ngModel = ctrls[0]; 
      ngModel.$formatters.push(function(value) { 
      var option = [].filter.call(el.children(), function(option) { 
       return option.value.toUpperCase() === value.toUpperCase() 
      })[0]; 
      return option ? option.value : value 
      }); 

     } 
     } 
    }); 

제가 = $ scope.inventoryDataCenters이 같은 것을 전달할 때 16,

예상 결과는 [ "TEST1", "TEST2"TEST3]

이고; DC.name의 ng-model은 값이 TesT1입니다.

드롭 다운은 대소 문자를 구분하지 않고 바인딩을 수행하여 TEST1을 표시해야합니다. 그것은 지금 일어나지 않습니다. 위의 솔루션은 정적 드롭 다운이있을 때 완벽하게 작동합니다. 고려해야 할

것들

ng-repeat="DC in workflowData.project_data.service_info.variables.service_data['data-center']" 

아래와 같이 선택 DC.name위한 NG 모델은 상기 어레이 DC로부터 유도 된 바와 같이 선택이 DIV NG 반복 안에 있다는 것이다.

Answer 1

검사는 대소 문자를 구분 값

https://jsfiddle.net/dwd2du17/6/

<div ng-app="module" ng-controller="controller as ctrl"> 
<select id="animal" ng-model="ctrl.animal"> 
    <option value="">--- Select ---</option> 
    <option value="CaT">Cat</option> 
    <option value="DOg">Dog</option> 
</select> 
{{ctrl.animal}} 
</div> 


var appForm = angular.module('module', []) 
.controller('controller', function($scope) { 
});