2016-06-09 1 views
0
내가 짓고 있어요 웹 앱 AngularJS와 및 각도 재료를 사용하고, 나는 대화 창에서 다음 HTML 양식이

:AngularJS와 /과 각도 재료 양식 유효성 MD-선택

<form name="cdc.clientForm"> 
    <md-dialog class="userDialog" ng-init="cdc.init()"> 
     <md-dialog-content> 
      <md-input-container flex> 
       <label>Company name</label> 
       <md-select ng-model="cdc.client.companyName" required> 
        <md-option value="Company 1">Company 1</md-option> 
        <md-option value="Company 2">Company 2</md-option> 
       </md-select> 
       </md-input-container> 
       <md-input-container> 
        <label>Client name</label> 
        <input type="text" ng-model="cdc.client.name" required> 
       </md-input-container> 
     </md-dialog-content> 
     <md-dialog-actions> 
      <md-button ng-click="cdc.submit()" ng-disabled="cdc.clientForm.$invalid">OK</md-button> 
      <md-button ng-click="cdc.cancel()">Cancel</md-button> 
     </md-dialog-actions> 
    </md-dialog> 
</form> 

과 나는 뒤에 다음과 같은 컨트롤러가있다 :

(function() { 
    'use strict'; 
    angular 
     .module('main') 
     .controller('ClientDialogController', ClientDialogController); 

    ClientDialogController.$inject = ['$mdDialog', 'client']; 

    function ClientDialogController($mdDialog, $q, client) { 
     var vm = this; 
     vm.init = init; 
     vm.submit = submit; 
     vm.cancel = cancel; 

     function init() { 
      if ((client !== undefined) && (client !== null)) { 
       vm.client = client; 
      } 
     }; 

     function cancel() { 
      $mdDialog.cancel(); 
     }; 

     function submit() { 
      $mdDialog.hide(vm.client); 
     }; 
    }; 
})(); 

내 모델의 생성과 업데이트를 위해 대화 상자를 재사용하고있다.

내 문제는 기본적으로 개체를 편집 할 때 형식 유효성이 있습니다.

양식에 md-select가 있고 md-select가 필수이며 원시 상태 인 경우 사용자가 선택 값을 수정하지 않으면 양식이 유효하지 않은 것으로 간주됩니다. 바운드 모델을 사용하는 텍스트 입력에서만 선택 항목을 제거해도 문제가 없으며 양식은 유효한 것으로 간주됩니다.

어떻게이 문제를 해결할 수 있습니까?이 문제를 해결하기 위해 권장되는 방법은 무엇입니까?

답변

0

음, 나는 이것을 스스로 알아 냈습니다. 아마 다른 사람에게 도움이 될 것입니다.

"Selects and Object Equality"부분 아래에있는 키는 이미 docs에 있었지만 그 사실을 알지 못했습니다.

<md-select ng-model="cdc.client.companyName" required ng-model-options="{trackBy: '$value'}"> 
    <md-option value="Company 1">Company 1</md-option> 
    <md-option value="Company 2">Company 2</md-option> 
</md-select> 
:

문제는 내가 아래와 같은 NG-모델 옵션 지시문을 추가하면 폼이 유효로 설정되어, 평등을위한 길 자바 스크립트 검사에게 있습니다