Góc 4 cho phép xác thực HTML5

Question

Tôi muốn sử dụng xác thực HTML5 trong Angular 4 thay vì xác nhận xác thực/phản hồi dựa trên biểu mẫu của chúng. Tôi muốn giữ cho xác thực chạy trong trình duyệt.

Nó được sử dụng để làm việc trong Angular 2, nhưng kể từ khi tôi nâng cấp, tôi không thể tạo các biểu mẫu được tạo thủ công mà không có bất kỳ chỉ thị góc nào để xác thực bằng HTML5.

Ví dụ, điều này sẽ không xác nhận trong trình duyệt tại tất cả:

<form> 
<h2>Phone Number Validation</h2> 
<label for="phonenum">Phone Number (format: xxxx-xxx-xxxx):</label><br /> 
<input id="phonenum" type="tel" pattern="^\d{4}-\d{3}-\d{4}$" required> 

<input type="submit" value="Submit"> 

</form> 

Answer 1

Angular4 tự động thêm một thuộc tính novalidate đến hình thức.

Để ghi đè này, bạn có thể thêm các chỉ thị ngNativeValidate mẫu.

<form ngNativeValidate> 
<h2>Phone Number Validation</h2> 
<label for="phonenum">Phone Number (format: xxxx-xxx-xxxx):</label><br /> 
<input id="phonenum" type="tel" pattern="^\d{4}-\d{3}-\d{4}$" required> 

<input type="submit" value="Submit"> 

</form> 

Đáng tiếc là tôi không thấy điều này được phản ánh trong các tài liệu được nêu ra, nhưng không tìm thấy nó bằng cách nhìn vào mã nguồn: https://github.com/angular/angular/blob/master/packages/forms/src/directives/ng_no_validate_directive.ts

Nó cũng xuất hiện thêm ngNoForm mẫu đã tác dụng tương tự như ngNativeValidate tùy về các trường hợp sử dụng của bạn cho việc cần khai báo điều gì đó không phải là một biểu mẫu vì bất kỳ lý do gì.

Hy vọng điều này sẽ hữu ích.

Answer 2

sử dụng ngNoForm hoặc ngNativeValidate trong mẫu của bạn

<form ngNoForm/ngNativeValidate> 
... 
</form>