2014-01-23 2 views
3

select 필드의 비어있는 옵션에 여러 가지 문제가 있습니다. 다음과 같이select 필드의 비어있는 옵션으로 문제가 발생했습니다.

내 렌더링 코드는 다음과 같습니다

우리의 UI가 동적으로 생성되며, 옵션은 동적 REST API를 사용하여 채 웁니다 여기
<select ng-switch-when="select" id="{{field.name}}" ng-model=data[field.name] > 
<option ng-repeat="option in field.options" value="{{option.value}}">{{option.description}} 
</select> 

. Select 필드는 처음에 공백 값을 가질 수있는 REST 호출을 사용하여 채워진 데이터 객체에 바인딩됩니다.

문제

  1. 그것은 자동이 필요하고 비어 있지 않은 옵션을 선택한 후 사라지지 않은 빈 옵션을 추가합니다.
  2. 또한
  3. 는 몇 가지 선택 필드
  4. function setupAsSingle(scope, selectElement, ngModelCtrl, selectCtrl) { 
    ngModelCtrl.$render = function() { 
    var viewValue = ngModelCtrl.$viewValue; 
    
        if (selectCtrl.hasOption(viewValue)) { 
        if (unknownOption.parent()) unknownOption.remove(); 
        selectElement.val(viewValue); 
        if (viewValue === '') emptyOption.prop('selected', true); // to make IE9 happy 
        } else { 
        if (isUndefined(viewValue) && emptyOption) { 
         selectElement.val(''); 
        } else { 
         selectCtrl.renderUnknownOption(viewValue); 
        } 
        } 
    

    에서 다음 코드 사용이 나는 의심의 여지가

TypeError: Cannot call method 'prop' of undefined at selectDirective.link.ngModelCtrl.$render (lib/angular/angular.js:20165:47) at Object.ngModelWatch (lib/angular/angular.js:16734:14) at Scope.$get.Scope.$digest (lib/angular/angular.js:11800:40) at Scope.$get.Scope.$apply (lib/angular/angular.js:12061:24) at done (lib/angular/angular.js:7843:45) at completeRequest (lib/angular/angular.js:8026:7) at XMLHttpRequest.xhr.onreadystatechange (lib/angular/angular.js:7982:11)

에 대한 오류를 다음 보여주는 ...

그것은에서 휴식 이 라인

if (viewValue === '') emptyOption.prop('selected', true); // to make IE9 happy 

빈 옵션은 이후 단계에서 REST API에 의해 제공되며 초기 렌더링까지 사용할 수 없으므로

구현 및 몇 가지 대체 방법에 대한 제안 사항을 제공해주십시오.

P.S : select와 함께 ng-option을 사용할 수 없으므로 색인 된 값을 출력하므로 일부 DOM 조작에 대한 실제 값이 필요합니다.

답변

1

먼저 데이터 - ng 옵션 (http://docs.angularjs.org/api/ng.directive:select)을 수행하는 방법을 읽었을 때 선택 사항이 약간의 문제를 일으킬 수 있습니다. 여기에 당신이 주변에 코드를 이동할 수있는 방법은 다음과 같습니다 둘째

<span data-ng-switch-when="select"> 
    <select id="{{field.name }}" data-ng-model="data[field.name]" data-ng-options="option.value as option.description for option in field.options></select> 
</span> 

, 데이터가 [field.name] option.value에 존재의 값으로 설정되어 있기 때문에 선택 빈 옵션 인 이유. 빈 옵션이 사라지도록 컨트롤러에 설정해야합니다. 비슷한 질문을 볼 수 있습니다. Why does AngularJS include an empty option in select?

관련 문제