2013-02-20 35 views
7

Tôi mới vào angular.jskiểm tra nếu dữ liệu đã tồn tại trên máy chủ trong angular.js

<input type="email" disabled='disabled' name="email" ng-model="userInfo.emailAddress" 
            class="input-xlarge settingitem" style="height:30px;"> 

<span ng-show="myForm.email.$error.email" class="help-inline" style="color:red;font-size:10px;"> 
             Not a Valid Email Address</span> 

Tôi có trường email, tương ứng với mà tôi cần phải kiểm tra tại máy chủ nếu nó đã tồn tại trong cơ sở dữ liệu hay không .

bất cứ ai có thể hướng dẫn cho tôi qua các bước như thế nào nó có thể được thực hiện bằng các chỉ thị và các dịch vụ góc để kiểm tra tại máy chủ

Trả lời

9

tôi sẽ đề nghị viết một chỉ thị đó sẽ cắm vào NgModelController#$parsers đường ống (đánh dấu "Custom Validation" từ http://docs.angularjs.org/guide/forms) .

Đây là một phác thảo của một chỉ thị như:

.directive('uniqueEmail', ["Users", function (Users) { 
    return { 
    require:'ngModel', 
    restrict:'A', 
    link:function (scope, el, attrs, ctrl) { 

     //TODO: We need to check that the value is different to the original 

     //using push() here to run it as the last parser, after we are sure that other validators were run 
     ctrl.$parsers.push(function (viewValue) { 

     if (viewValue) { 
      Users.query({email:viewValue}, function (users) { 
      if (users.length === 0) { 
       ctrl.$setValidity('uniqueEmail', true); 
      } else { 
       ctrl.$setValidity('uniqueEmail', false); 
      } 
      }); 
      return viewValue; 
     } 
     }); 
    } 
    }; 
}]) 

Trường hợp Users.query là một cuộc gọi async để kiểm tra xem một email là duy nhất hay không. Tất nhiên bạn nên thay thế điều này bằng một cuộc gọi đến back-end của bạn.

Khi hoàn tất, chỉ thị này có thể được sử dụng như sau:

<input type="email" ng-model="user.email" unique-email> 

Ví dụ về chỉ thị này được lấy từ các angular-app rằng một số thành viên AngularJS cộng đồng cố gắng để đặt lại với nhau để minh họa chung trường hợp sử dụng. Nó có thể là giá trị kiểm tra ra để xem làm thế nào tất cả điều này phù hợp với nhau trong ứng dụng hoàn chỉnh.

+0

Cảm ơn câu trả lời của bạn, Bạn cũng có thể đề xuất cách so sánh giá trị trước đó. –

+0

giải pháp của bạn đang hoạt động tốt, nhưng tôi đang đối mặt với một vấn đề, khi tôi nhận được cuộc gọi lại từ máy chủ, toàn bộ biểu mẫu của tôi bị xóa –

+0

Làm thế nào để bạn gọi từ máy chủ? –

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