ຫົວຂໍ້ຫົວຂໍ້ textarea AngularJS

ການອະທິບາຍ ແລະ ການນໍາໃຊ້

AngularJS ປ່ຽນ <textarea> ພະຍາຍາມທີ່ເປັນພົນຕົວຂອງປະກອບສະຖານທີ່, ແຕ່ກໍ່ມີ ng-model ມີ.

ພວກເຂົາໃຫ້ການວັງປະສານຂໍ້ມູນ, ຄວາມຄິດວ່າພວກເຂົາແມ່ນສ່ວນໜຶ່ງຂອງຕົວເລື່ອງ AngularJS ແລະສາມາດນຳໃຊ້ແລະກໍ່ຈະອັບໂຫລດໃນການປະຕິບັດການ AngularJS ແລະ DOM.

ພວກເຂົາໃຫ້ການການກວດກາ. ເປັນຕົວຢ່າງ: ມີ required ຂອງປະເພດຄວາມຄິດ <textarea> ປະກອບສະຖານທີ່ $valid ສະຖານະຈະຖືກການກວດສອບ false.

ພວກເຂົາຍັງໃຫ້ການຄວາມຄິດກັບສະຖານະ. AngularJS ບັນທຶກສະຖານະປະຈຳບົນທີ່ມີຢູ່ຂອງບົນທີ່ມີກົນລະບຽບ.

ບົນທີ່ມີສະຖານະກຳທີ່:

  • $untouched ບົນຍັງບໍ່ຖືກກວດສອບ
  • $touched ບົນມາຖືກກວດສອບ
  • $pristine 该字段尚未被修改
  • $dirty 该字段已被修改
  • $invalid 字段内容无效
  • $valid 字段内容有效

ຄວາມຄິດຂອງແຕ່ລະສະຖານະກຳລັງຖືກສະແດງເປັນຄວາມຈິງຫຼືບໍ່.

ຕົວຢ່າງ

ບົນທີ່ມີການວັງປະສານຂໍ້ມູນ:

<textarea ng-model="myTextarea"></textarea>
<p>ຄວາມຄິດຂອງບົນທີ່:</p>
<h1>{{myTextarea}}</h1>

ທົດລອງດີຕະຫຼອດ

ກົດລະບຽບ

<textarea ng-model="name"></textarea>

ຜ່ານການນຳໃຊ້ ng-model ຄວາມຄິດຂອງອັນດັບມາຂອງປະເພດຄວາມຄິດຂອງບົນ.

CSS ປະເພດ

ຕະຫຼອດການປ່ຽນແປງ AngularJS <textarea> ປະກອບສະຖານທີ່ມີປະເພດຄັນດັ່ງກ່າວ. ປະເພດດັ່ງກ່າວສາມາດນຳໃຊ້ເພື່ອການການຈັດວັດຖຸບັນທຶກຄວາມຄິດຂອງຕົວເລື່ອງ.

ຕິດຕັ້ງປະເພດຄັນລາຍລະອຽດນີ້:

  • ng-untouched ບົນຍັງບໍ່ຖືກກວດສອບ
  • ng-touched ບົນມາຖືກກວດສອບ
  • ng-pristine 该字段尚未被修改
  • ng-dirty 该字段已被修改
  • ng-valid 字段内容有效
  • ng-invalid 字段内容无效
  • ng-valid-key 每次验证一个密钥。例如:ng-valid-requiredມັນຈະມີປະສິດທິພາບທີ່ສຸດໃນການກວດກາຫຼາຍຢ່າງທີ່ຕ້ອງກວດກາ.
  • ng-invalid-key ຕົວຢ່າງ:ng-invalid-required

ຖ້າມາດຕະການຕາມມາດຕະການຂອງມາດຕະການແມ່ນ: falseຖ້າມີຄວາມຈິງຕາມມາດຕະການ ຄວາມຈິງຂອງມາດຕະການຈະຖືກລຶບລ້າງ.

ຕົວຢ່າງ

ນຳໃຊ້ CSS ສະແນວງານ ເພື່ອນຳໃຊ້ວິສາຍສະແບບ ສຳລັບບັນດາປະເພດຂອງບໍລິສັດທີ່ມີຄວາມພິເສດ ແລະ ບໍ່ມີຄວາມພິເສດ:

<style>
textarea.ng-invalid {
    background-color: pink;
}
textarea.ng-valid {
    background-color: lightgreen;
}
</style>

ທົດລອງດີຕະຫຼອດ