Angular Gauntlets: เครื่องมือที่มีประโยชน์สำหรับนักพัฒนา Angular
Angular Gauntlets คือส่วนเสริมของ Chrome ฟรีที่พัฒนาโดย yannickglt ส่วนเสริมนี้อยู่ในหมวดหมู่ของเบราว์เซอร์และโดยเฉพาะในหมวดหมู่ของเครื่องมือเสริมและเครื่องมือ ส่วนเสริมที่มีประโยชน์นี้จะช่วยให้คุณสามารถดีบักแอปพลิเคชัน Angular ได้อย่างง่ายดาย ซึ่งเป็นสิ่งที่ต้องมีสำหรับนักพัฒนา Angular
ด้วย Angular Gauntlets คุณสามารถเข้าถึงคอมโพเนนต์และโปรไวเดอร์ของแอปพลิเคชัน Angular ของคุณได้โดยตรงจากแผงองค์ประกอบของ Chrome DevTools แค่คลิกที่องค์ประกอบ DOM ในแผงและใช้คีย์เวิร์ดหนึ่งในรายการต่อไปนี้ในคอนโซลเพื่อเข้าถึงฟังก์ชันที่ต้องการ:
- $component: โดยการคลิกที่องค์ประกอบ DOM ที่อ้างอิงถึงคอมโพเนนต์ Angular คุณสามารถเข้าถึงตัวอย่างของคอมโพเนนต์และทำงานร่วมกับมันได้
- $context: คีย์เวิร์ดนี้ช่วยให้คุณสามารถแสดงบริบทขององค์ประกอบ DOM เช่นคอมโพเนนต์ Angular หรือแถว ngFor
- $scope: คล้ายกับ $component แต่ใช้กับองค์ประกอบลูก เป็นทางเลือกที่ดีสำหรับ AngularJS Batarang สำหรับ Angular
- $providers: คีย์เวิร์ดนี้จะให้รายการของผู้ให้บริการทั้งหมดที่ถูกสร้างขึ้นในแอป Angular ของคุณเพื่อให้คุณสามารถทดลองใช้กับพวกเขาได้ (ไม่รองรับโดย Angular 9)
- $detectChanges(): ใช้คีย์เวิร์ดนี้เพื่อเรียกใช้การตรวจจับการเปลี่ยนแปลงของ Angular และนำการเปลี่ยนแปลงของคุณไปใช้งาน
- log$(obs): คีย์เวิร์ดนี้จะบันทึกค่าแรกของออบเซอร์ที่กำหนด
นอกจากนี้ Angular Gauntlets ยังมีการแสดงตัวอย่างของข้อมูลทั้งหมดนี้ในแท็บ Angular ของแผงองค์ประกอบ DevTools การสลับระหว่างองค์ประกอบจะรีเฟรชข้อมูลทันทีเพื่อให้คุณได้รับการอัปเดตแบบเรียลไทม์
โดยรวม Angular Gauntlets เป็นเครื่องมือที่มีคุณค่าที่จะทำให้กระบวนการดีบักสำหรับนักพัฒนา Angular ง่ายขึ้น อินเทอร์เฟซที่ใช้งานง่ายและทางลัดที่สะดวกทำให้คุณสามารถเข้าถึงและจัดการคอมโพเนนต์และโปรไวเดอร์ภายในแอปพลิเคชัน Angular ของคุณได้อย่างง่ายดาย
