2013-03-12 27 views
57

Sau đây là đoạn mã của tôi. Tôi muốn xác nhận danh sách thả xuống của mình bằng góc cạnh. AngularJS Dropdown yêu cầu xác nhận

<td align="left" width="52%"> 
    <span class="requiredSmall">*</span> 
    <select class="Sitedropdown" style="width: 220px;" 
      ng-model="selectedSpecimen().serviceID" 
      ng-options="service.ServiceID as service.ServiceName for service in services"> 
     <option value="" ng-selected="selected">Select Service</option> 
    </select> 
</td> 

phương tiện hợp lệ:

giá trị hợp lệ có thể được bất cứ điều gì nhưng "Chọn dịch vụ", đó là giá trị mặc định của tôi. Giống như trình xác nhận hợp lệ ASP.net RequireTrên DefaultValue = "0" cho trình đơn thả xuống, vì vậy ở đây Trình đơn thả xuống của tôi sẽ bị ràng buộc khỏi các dịch vụ và tôi muốn chọn tất cả các giá trị khác ngoại trừ "Chọn dịch vụ".

Trả lời

113

Bạn cần phải thêm một 'tên' thuộc tính vào danh sách thả xuống của bạn, sau đó bạn cần phải thêm một thuộc tính required, và sau đó bạn có thể tham khảo các lỗi sử dụng myForm.[input name].$error.required:

HTML:

<form name="myForm" ng-controller="Ctrl"> 

    <select name="service_id" class="Sitedropdown" style="width: 220px;"   
      ng-model="ServiceID" 
      ng-options="service.ServiceID as service.ServiceName for service in services" 
      required> 
    <option value="">Select Service</option> 
    </select> 
    <span ng-show="myForm.service_id.$error.required">Select service</span> 

</form> 

Bộ điều khiển:

function Ctrl($scope) { 
    $scope.services = [ 
    {ServiceID: 1, ServiceName: 'Service1'}, 
    {ServiceID: 2, ServiceName: 'Service2'}, 
    {ServiceID: 3, ServiceName: 'Service3'} 
    ]; 
} 

Đây là công việc plunker.

+7

Cần lưu ý rằng chọn cần ng-model để làm việc này – phikes

+3

Đúng, ngOptions yêu cầu ngModel. – Stewie

+0

ví dụ này rất hữu ích. cảm ơn bạn. – ddagsan

Các vấn đề liên quan