เข้าตรวจสอบ AngularJS
AngularJS รูปแบบและการควบคุมปัจจัยการผลิตสามารถตรวจสอบข้อมูล
เข้าตรวจสอบ
ในส่วนก่อนหน้านี้คุณได้เรียนรู้เกี่ยวกับความรู้ในรูปแบบ AngularJS และการควบคุม
AngularJS รูปแบบและการควบคุมที่สามารถนำเสนอคุณสมบัติและการตรวจสอบข้อมูลที่ผิดกฎหมายเข้ามาโดยผู้ใช้เตือน
 | ตรวจสอบว่าลูกค้าไม่สามารถมั่นใจในความปลอดภัยของการป้อนข้อมูลของผู้ใช้เซิร์ฟเวอร์การตรวจสอบข้อมูลยังเป็นสิ่งที่จำเป็น |
|---|
การประยุกต์ใช้รหัส
<! DOCTYPE html>
<html>
<script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<body>
<h2> การตรวจสอบตัวอย่าง </ H2 >
<form NG-App = "MyApp " NG-ควบคุม = "validateCtrl"
name = "myForm" novalidate>
<p> ชื่อผู้ใช้: ฟรี
<ประเภทขาเข้า = "text" ชื่อ = "ผู้ใช้" NG-รุ่น = "ผู้ใช้" ที่จำเป็น>
<span style = "สี: สีแดง " NG-แสดง = " .. MyForm.user $ สกปรก && myForm.user $ ที่ไม่ถูกต้อง">
<span NG-แสดง = "myForm.user . $ Error.required"> ชื่อผู้ใช้เป็นสิ่งที่จำเป็น </ span>
</ span>
</ p>
<p> E-mail: ฟรี
<input type = "อีเมล" ชื่อ = "อีเมล" NG-รุ่น = "อีเมล" ที่จำเป็น>
<span style = "สี: สีแดง " NG-แสดง = " .. MyForm.email $ สกปรก && myForm.email $ ที่ไม่ถูกต้อง">
<span NG-แสดง = "myForm.email . $ Error.required"> กล่องจดหมายเป็นต้อง </ span>
<span NG-แสดง = "myForm.email . $ Error.email"> กล่องจดหมายที่ผิดกฎหมาย </ span>
</ span>
</ p>
<p>
<ประเภทขาเข้า = "ส่ง"
NG-พิการ = "myForm.user. $ สกปรก && myForm.user. $ || ที่ไม่ถูกต้อง
myForm.email. $ สกปรก && myForm.email. $ ที่ไม่ถูกต้อง ">
</ p>
</ form>
<script>
var App = angular.module ( 'MyApp' []);
app.controller ( 'validateCtrl' ฟังก์ชั่น ($ ขอบเขต) {
$ Scope.user = 'จอห์นโด';
$ Scope.email = '[email protected]';
});
</ script>
</ body>
</ html>
<html>
<script src = "http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"> </ script>
<body>
<h2> การตรวจสอบตัวอย่าง </ H2 >
<form NG-App = "MyApp " NG-ควบคุม = "validateCtrl"
name = "myForm" novalidate>
<p> ชื่อผู้ใช้: ฟรี
<ประเภทขาเข้า = "text" ชื่อ = "ผู้ใช้" NG-รุ่น = "ผู้ใช้" ที่จำเป็น>
<span style = "สี: สีแดง " NG-แสดง = " .. MyForm.user $ สกปรก && myForm.user $ ที่ไม่ถูกต้อง">
<span NG-แสดง = "myForm.user . $ Error.required"> ชื่อผู้ใช้เป็นสิ่งที่จำเป็น </ span>
</ span>
</ p>
<p> E-mail: ฟรี
<input type = "อีเมล" ชื่อ = "อีเมล" NG-รุ่น = "อีเมล" ที่จำเป็น>
<span style = "สี: สีแดง " NG-แสดง = " .. MyForm.email $ สกปรก && myForm.email $ ที่ไม่ถูกต้อง">
<span NG-แสดง = "myForm.email . $ Error.required"> กล่องจดหมายเป็นต้อง </ span>
<span NG-แสดง = "myForm.email . $ Error.email"> กล่องจดหมายที่ผิดกฎหมาย </ span>
</ span>
</ p>
<p>
<ประเภทขาเข้า = "ส่ง"
NG-พิการ = "myForm.user. $ สกปรก && myForm.user. $ || ที่ไม่ถูกต้อง
myForm.email. $ สกปรก && myForm.email. $ ที่ไม่ถูกต้อง ">
</ p>
</ form>
<script>
var App = angular.module ( 'MyApp' []);
app.controller ( 'validateCtrl' ฟังก์ชั่น ($ ขอบเขต) {
$ Scope.user = 'จอห์นโด';
$ Scope.email = '[email protected]';
});
</ script>
</ body>
</ html>
ลอง»
| รูปแบบ HTML แอตทริบิวต์ novalidate สำหรับการปิดใช้งานการตรวจสอบเริ่มต้นของเบราเซอร์ |
|---|
ตัวอย่างของการวิเคราะห์
AngularJS คำแนะนำ NG-รูปแบบถูกนำมาใช้ในการผูกเข้ากับองค์ประกอบรูปแบบ
รูปแบบวัตถุมีสองคุณลักษณะ: ผู้ใช้และอีเมล์
เราใช้คำสั่ง NG-แสดงสี: สีแดงในข้อความเป็นเพียง $ $ สกปรกหรือการแสดงผลที่ไม่ถูกต้อง
| คุณสมบัติ | ลักษณะ |
|---|---|
| $ สกปรก | มีรูปแบบในการกรอกข้อมูลการบันทึกเป็น |
| สามารถใช้คูปองได้ $ | เนื้อหาในฟิลด์ที่ถูกต้อง |
| $ ไม่ถูกต้อง | เนื้อหาในฟิลด์ที่ผิดกฎหมาย |
| $ เก่าแก่ | ไม่มีรูปแบบในการกรอกข้อมูลการบันทึก |