Ng-change ใน Angular JS คืออะไรและกำหนดค่าให้กับมันได้อย่างไร

สวัสดีเรามาเรียนรู้เกี่ยวกับคำสั่งที่น่าสนใจที่มีให้ใน นั่นคือคำสั่ง ng-change ชื่อของตัวเองบางส่วนให้งานที่ดำเนินการ โดยปกติโปรแกรมเมอร์จะสับสนระหว่างเหตุการณ์ on-change และ ng-change วันนี้เรามาเคลียร์ทุกอย่างในบล็อกนี้ หัวข้อที่เราจะพูดถึงในวันนี้ ได้แก่ :

วิธีการย้อนกลับสตริงใน python

• คำสั่งคืออะไร?
• ng-change คืออะไร?
• ประเด็นสำคัญในขณะที่ใช้คำสั่ง ng-change
• ไวยากรณ์
• ตัวอย่าง

ก่อนที่จะดำเนินการกับบล็อกก่อนอื่นเราจะมาดูว่า Directives ใน AngularJS คืออะไร

คำสั่งคืออะไร?

คำสั่ง AngularJS เป็นเพียงแอตทริบิวต์ HTML ที่มีคำนำหน้า 'ng-' AngularJS มีชุดคำสั่งในตัวซึ่งมีให้ ฟังก์ชันต่างๆ กับแอปพลิเคชันของเรา

AngularJS ยังให้เรากำหนดคำสั่งของเราเอง

ng-change คืออะไร?

เปลี่ยนเป็น ซึ่งมีไว้สำหรับการดำเนินการเมื่อค่าส่วนประกอบหรือเหตุการณ์เปลี่ยนแปลง กล่าวอีกนัยหนึ่งng- การเปลี่ยนแปลงคำสั่งจะบอก AngularJS ว่าจะทำอย่างไรเมื่อค่าขององค์ประกอบ HTML เปลี่ยนไป

อันng-modelคำสั่งจำเป็นต้องใช้โดย ng-change directive

ประเด็นสำคัญขณะใช้คำสั่ง ng-change:

• จะเกิดอะไรขึ้นกับเหตุการณ์ onChangeng- การเปลี่ยนแปลงคำสั่งจาก AngularJS ไม่ได้แทนที่เหตุการณ์ onchange ดั้งเดิมขององค์ประกอบทั้งng- การเปลี่ยนแปลงนิพจน์และเหตุการณ์ onchange ดั้งเดิมจะถูกดำเนินการ
• ng- การเปลี่ยนแปลงเหตุการณ์จะถูกทริกเกอร์ทุกครั้งที่มีการเปลี่ยนแปลงของค่า จะไม่รอให้ทำการเปลี่ยนแปลงทั้งหมดหรือทำให้ช่องป้อนข้อมูลสูญเสียโฟกัส
• ng- การเปลี่ยนแปลงเหตุการณ์จะถูกทริกเกอร์ก็ต่อเมื่อมีการเปลี่ยนแปลงที่เกิดขึ้นจริงในค่าอินพุตไม่ใช่หากการเปลี่ยนแปลงเกิดขึ้นจาก JavaScript
• คำสั่ง ng-change นี้รองรับโดยแท็ก HTML เช่นและ
• นิพจน์ ngChange จะได้รับการประเมินก็ต่อเมื่อการเปลี่ยนแปลงในค่าอินพุตทำให้ค่าใหม่ถูกกำหนดให้กับโมเดล

จะไม่ได้รับการประเมิน:

1. หากค่าที่ส่งคืนจากไปป์ไลน์การแปลงพาร์เซอร์ $ ไม่เปลี่ยนแปลง
2. หากอินพุตยังคงไม่ถูกต้องเนื่องจากโมเดลจะยังคงเป็นโมฆะ
3. หากโมเดลไม่ได้ถูกเปลี่ยนแปลงโดยค่าอินพุต แต่เป็นแบบทางโปรแกรม

บันทึก คำสั่งนี้ต้องการngModelที่จะนำเสนอ

ไวยากรณ์:

< ธาตุ ng- การเปลี่ยนแปลง=“ การแสดงออก” > ธาตุ >

นิพจน์: ระบุนิพจน์ที่ดำเนินการเมื่อค่าขององค์ประกอบเปลี่ยนแปลง

ตัวอย่าง:

 
กรุณาพิมพ์ในช่องป้อนข้อมูล:
 
ช่องป้อนข้อมูลมีการเปลี่ยนแปลง {{count}} ครั้ง
angular.module ('App1', []) .controller ('cng1l', ['$ scope', function ($ scope) {$ scope.count = 0 $ scope.myFunc = function () {$ scope.count ++} }])

เอาต์พุต (หลังจากการเปลี่ยนแปลง 3 ครั้ง)

กรุณาพิมพ์ในช่องป้อนข้อมูล:

ช่องป้อนข้อมูลมีการเปลี่ยนแปลง 3 ครั้ง

ฉันหวังว่าตอนนี้คุณอาจมีความเข้าใจที่ชัดเจนเกี่ยวกับคำสั่ง ng-change แล้วลองใช้มันในโปรแกรมของคุณและดูว่าคุณได้เรียนรู้มากแค่ไหน ขอบคุณที่อ่าน.ฉันอยากจะแนะนำให้คุณผ่านสิ่งนี้ บทช่วยสอนเชิงมุม รายการเล่นวิดีโอ Edureka เพื่อดูวิดีโอและเรียนรู้วิธีการทำงานกับแอปพลิเคชัน Angular

ตอนนี้คุณรู้ Angular Directive แล้วให้ตรวจสอบไฟล์ โดย Edureka บริษัท การเรียนรู้ออนไลน์ที่เชื่อถือได้ซึ่งมีเครือข่ายผู้เรียนที่พึงพอใจมากกว่า 250,000 คนกระจายอยู่ทั่วโลก Angular เป็นเฟรมเวิร์ก JavaScript ที่ใช้เพื่อสร้างแอปพลิเคชันเว็บฝั่งไคลเอ็นต์ที่ปรับขนาดได้และมีประสิทธิภาพ เนื่องจากการใช้ Angular framework อยู่ในระดับสูงการจัดการประสิทธิภาพของแอปพลิเคชันจึงเป็นแรงผลักดันจากชุมชนในทางอ้อมที่ผลักดันโอกาสในการทำงานที่ดี การฝึกอบรมการรับรองเชิงมุมมีวัตถุประสงค์เพื่อครอบคลุมแนวคิดใหม่ ๆ เกี่ยวกับการพัฒนาแอปพลิเคชันขององค์กร