75 คำถามและคำตอบสัมภาษณ์ AngularJS (2025)
คำถามและคำตอบสัมภาษณ์ AngularJS สำหรับนักศึกษาใหม่
1) AngularJS คืออะไร?
AngularJS เป็น Javaกรอบงานสคริปต์ที่ใช้สำหรับสร้างแอปพลิเคชันเว็บเพจเดียว ช่วยให้คุณสามารถใช้ HTML เป็นภาษาเทมเพลตและขยายรูปแบบไวยากรณ์ของ HTML เพื่อแสดงส่วนประกอบของแอปพลิเคชันได้อย่างชัดเจน
👉 ดาวน์โหลด PDF ฟรี: คำถามและคำตอบสัมภาษณ์ AngularJS >>
2) คุณสมบัติหลักของ AngularJS คืออะไร?
คุณสมบัติที่สำคัญของ AngularJS คือ:
- ขอบเขต
- ตัวควบคุม
- รุ่น
- รายละเอียด
- บริการ
- การผูกข้อมูล
- คำแนะนำ
- ฟิลเตอร์
- ทดสอบได้
3) อธิบายขอบเขตของฟังก์ชันใน AngularJS
ขอบเขต หมายถึงโมเดลแอปพลิเคชัน ซึ่งทำหน้าที่เหมือนกาวเชื่อมระหว่างตัวควบคุมแอปพลิเคชันและมุมมอง ขอบเขตจะถูกจัดเรียงในโครงสร้างแบบลำดับชั้นและเลียนแบบโครงสร้าง DOM (Document Object Model) ของแอปพลิเคชัน สามารถดูนิพจน์และเผยแพร่เหตุการณ์ได้
4) อธิบายบริการใน AngularJS
บริการ AngularJS คือออบเจ็กต์หรือฟังก์ชันซิงเกิลตันที่ใช้เพื่อดำเนินงานเฉพาะด้าน มันมีตรรกะทางธุรกิจอยู่บ้าง
5) นิพจน์เชิงมุมคืออะไร? อธิบายความแตกต่างที่สำคัญระหว่างนิพจน์เชิงมุมและ Javaการแสดงออกของสคริปต์
Like Javaสคริปต์ นิพจน์เชิงมุม เป็นสไนปเป็ตโค้ดที่มักจะวางไว้ในการผูก เช่น {{ expression }}
ความแตกต่างที่สำคัญระหว่าง Javaนิพจน์สคริปต์และนิพจน์เชิงมุมคือ:
- บริบท: ใน Angular นิพจน์จะถูกประเมินโดยเทียบกับวัตถุขอบเขต ในขณะที่ Javaการแสดงออกของสคริปต์จะได้รับการประเมินเทียบกับหน้าต่างทั่วโลก
- การให้อภัย: ในนิพจน์เชิงมุม การประเมินจะยกโทษให้เป็นโมฆะและไม่ได้กำหนดไว้ ในขณะที่อยู่ใน Javaคุณสมบัติสคริปต์ที่ไม่ได้กำหนดจะสร้าง TypeError หรือ ReferenceError
- ไม่มีคำชี้แจงขั้นตอนการควบคุม: ไม่สามารถใช้ลูป เงื่อนไข หรือข้อยกเว้นในนิพจน์เชิงมุมได้
- ตัวกรอง: คุณสามารถใช้ตัวกรองเพื่อจัดรูปแบบข้อมูลก่อนแสดงได้
6) คุณจะเริ่มต้นกล่องเลือกที่มีตัวเลือกในการโหลดหน้าได้อย่างไร
คุณสามารถเริ่มต้นกล่องเลือกด้วยตัวเลือกในการโหลดหน้าได้โดยใช้คำสั่ง ng-init
- <div ng-controller = ” apps/dashboard/account ” ng-switch
- เปิด = “! - บัญชี” ng-init = ” loadData ( ) ">
7) คำสั่งคืออะไร? ตั้งชื่อคำสั่งที่ใช้บ่อยที่สุดในแอปพลิเคชัน AngularJS
คำสั่งคือสิ่งที่แนะนำไวยากรณ์ใหม่ พวกมันเป็นเหมือนเครื่องหมายบนองค์ประกอบ DOM ซึ่งแนบลักษณะการทำงานพิเศษไว้กับองค์ประกอบนั้น ในแอปพลิเคชัน AngularJS คำสั่งเป็นองค์ประกอบที่สำคัญที่สุด
คำสั่งที่ใช้กันทั่วไปบางส่วน ได้แก่:
1) ng-รุ่น
2) ng-แอป
3) ng-ผูก
4) ng-ทำซ้ำ
5) ng-แสดง
8) เส้นทาง Angular JS ทำงานอย่างไร
เส้นทาง AngularJS ช่วยให้คุณสร้าง URL ที่แตกต่างกันสำหรับเนื้อหาที่แตกต่างกันในแอปพลิเคชันของคุณ URL ที่แตกต่างกันสำหรับเนื้อหาที่แตกต่างกันทำให้ผู้ใช้สามารถบุ๊กมาร์ก URL ไปยังเนื้อหาเฉพาะได้ URL ที่สามารถบุ๊กมาร์กได้แต่ละรายการใน AngularJS เรียกว่าเส้นทาง
ค่าใน Angular JS เป็นวัตถุธรรมดา อาจเป็นตัวเลข สตริง หรือ Javaวัตถุสคริปต์ โดยทั่วไปค่าจะถูกใช้เป็นค่าคอนฟิกูเรชันที่ฉีดเข้าไปในโรงงาน บริการ หรือตัวควบคุม ค่าควรเป็นของโมดูล AngularJS
การฉีดค่าลงในฟังก์ชันตัวควบคุม AngularJS ทำได้โดยการเพิ่มพารามิเตอร์ที่มีชื่อเดียวกันกับค่า
9) การผูกข้อมูลใน AngularJS คืออะไร?
การซิงโครไนซ์ข้อมูลอัตโนมัติระหว่างส่วนประกอบของโมเดลและมุมมองเรียกว่าการผูกข้อมูลใน AngularJS มีสองวิธีในการผูกข้อมูล
- การทำเหมืองข้อมูลในระบบเทมเพลตแบบคลาสสิก
- การเชื่อมโยงข้อมูลในเทมเพลตเชิงมุม
10) AngularJS มีประโยชน์อย่างไร?
ประโยชน์ของ AngularJS คือ:
- การลงทะเบียนโทรกลับ: ไม่จำเป็นต้องลงทะเบียนการโทรกลับ สิ่งนี้ทำให้โค้ดของคุณง่ายและแก้ไขข้อบกพร่องได้ง่าย
- ควบคุม HTML DOM โดยทางโปรแกรม: แอปพลิเคชันที่สร้างขึ้นโดยใช้ Angular ไม่จำเป็นต้องจัดการ DOM
- ถ่ายโอนข้อมูลเข้าและออกจาก UI: AngularJS ช่วยกำจัดส่วนสำเร็จรูปเกือบทั้งหมด สามารถตรวจสอบแบบฟอร์ม แสดงข้อผิดพลาด กลับสู่โมเดลภายใน และอื่นๆ
- ไม่มีรหัสเริ่มต้น: ด้วย AngularJS คุณสามารถบูตแอปของคุณได้อย่างง่ายดาย คุณสามารถใช้บริการฉีดอัตโนมัติในแอปพลิเคชันของคุณใน Guice
11) การแก้ไขสตริงใน Angular.JS คืออะไร
ใน Angular.js คอมไพเลอร์ระหว่างกระบวนการคอมไพล์จะจับคู่ข้อความและแอตทริบิวต์ ใช้บริการสอดแทรกเพื่อดูว่ามีนิพจน์ที่ฝังอยู่หรือไม่ เนื่องจากเป็นส่วนหนึ่งของวงจรการแยกย่อยตามปกติ นิพจน์เหล่านี้จึงได้รับการอัปเดตและลงทะเบียนเป็นนาฬิกา
12) ขั้นตอนในการคอมไพล์ HTML มีอะไรบ้าง?
กระบวนการรวบรวม HTML เกิดขึ้นในลักษณะต่อไปนี้
- เมื่อใช้ API ของเบราว์เซอร์มาตรฐาน ขั้นแรก HTML จะถูกแยกวิเคราะห์เป็น DOM
- โดยใช้การโทรไปที่
$compile ()
วิธีการ จะมีการคอมไพล์ DOM วิธีการลัดเลาะไปตาม DOM และตรงกับคำสั่ง - เชื่อมโยงเทมเพลตกับขอบเขตโดยการเรียกใช้ฟังก์ชันการเชื่อมโยงที่ส่งคืนจากขั้นตอนก่อนหน้า
13) อธิบายคำสั่งและประเภทของคำสั่ง
ในระหว่างกระบวนการคอมไพล์ เมื่อมีการเรียกใช้ฟังก์ชัน HTML เฉพาะ จะเรียกว่าคำสั่ง มันถูกดำเนินการเมื่อคอมไพเลอร์พบมันใน DOM
คำสั่งประเภทต่าง ๆ ได้แก่ :
1) คำสั่งองค์ประกอบ
2) คำสั่งคุณสมบัติ
3) คำสั่งคลาส CSS
4) คำสั่งแสดงความคิดเห็น
14) อธิบายฟังก์ชั่นการเชื่อมโยงและประเภทของมัน
ลิงก์รวมคำสั่งเข้ากับขอบเขตและสร้างมุมมองแบบสด สำหรับการลงทะเบียน DOM Listener ตลอดจนการอัปเดต DOM ฟังก์ชันลิงก์จะรับผิดชอบ หลังจากโคลนเทมเพลตแล้ว ก็จะถูกดำเนินการ
- ฟังก์ชั่นการเชื่อมโยงล่วงหน้า: ฟังก์ชันการเชื่อมโยงล่วงหน้าจะดำเนินการก่อนที่จะเชื่อมโยงองค์ประกอบย่อย ไม่ถือเป็นวิธีที่ปลอดภัยสำหรับการแปลง DOM
- ฟังก์ชั่นการเชื่อมโยงโพสต์: ฟังก์ชันการเชื่อมโยงโพสต์จะดำเนินการหลังจากเชื่อมโยงองค์ประกอบลูกแล้ว การแปลง DOM ด้วยฟังก์ชันหลังการเชื่อมโยงทำได้อย่างปลอดภัย
15) อธิบายหัวฉีดใน AngularJS
หัวฉีดเป็นตัวระบุตำแหน่งบริการ ใช้เพื่อดึงข้อมูลอินสแตนซ์ออบเจ็กต์ตามที่กำหนดโดยผู้ให้บริการ ประเภทอินสแตนซ์ วิธีการเรียกใช้ และโหลดโมดูล มีหัวฉีดตัวเดียวต่อแอปพลิเคชัน Angular ซึ่งช่วยในการค้นหาอินสแตนซ์อ็อบเจ็กต์ตามชื่อ
16) อะไรคือความแตกต่างที่สำคัญระหว่างลิงก์และการคอมไพล์ใน Angular.js?
- ฟังก์ชั่นการคอมไพล์: ใช้สำหรับการจัดการเทมเพลต DOM และรวบรวมคำสั่งทั้งหมด
- ฟังก์ชั่นลิงค์: ใช้สำหรับการลงทะเบียนผู้ฟัง DOM เช่นเดียวกับการจัดการ DOM จะดำเนินการเมื่อมีการโคลนเทมเพลตแล้ว
17) ฟังก์ชั่นโรงงานใน AngularJS คืออะไร?
สำหรับการสร้างคำสั่งจะใช้วิธีโรงงาน มันถูกเรียกใช้เพียงครั้งเดียวเมื่อคอมไพเลอร์ตรงกับคำสั่งเป็นครั้งแรก โดยใช้ $injector.inrigg วิธีการของโรงงานจะถูกเรียกใช้
18) อธิบายรูปแบบสไตล์ที่ ngModel เพิ่มในคลาส CSS
NgModel เพิ่มคลาส CSS เหล่านี้เพื่อให้สามารถจัดสไตล์ของแบบฟอร์มได้ คลาสการตรวจสอบความถูกต้องของ AngularJS คือ:
- ng- ถูกต้อง
- ng- ไม่ถูกต้อง
- ng-เก่าแก่
- ng-สกปรก
19) “ขอบเขต” มีลักษณะอย่างไร
- ขอบเขตการกลายพันธุ์ของโมเดลผู้สังเกตการณ์ให้จัดเตรียม API ($watch)
- เพื่อเผยแพร่การเปลี่ยนแปลงโมเดลใด ๆ ผ่านระบบไปยังมุมมองจากภายนอกขอบเขตเชิงมุม
- ขอบเขตสืบทอดคุณสมบัติจากขอบเขตหลัก ในขณะที่ให้การเข้าถึงคุณสมบัติของโมเดลที่ใช้ร่วมกัน ขอบเขตสามารถซ้อนกันเพื่อแยกส่วนประกอบของแอปพลิเคชัน
- ขอบเขตจะให้บริบทกับนิพจน์ที่ได้รับการประเมิน
20) DI (การพึ่งพาการฉีด) คืออะไร และวัตถุหรือฟังก์ชันสามารถรับการพึ่งพาได้อย่างไร
DI หรือ Dependency Injection คือรูปแบบการออกแบบซอฟต์แวร์ที่เกี่ยวข้องกับวิธีที่โค้ดเข้าถึงการอ้างอิงของมัน เพื่อดึงองค์ประกอบของแอปพลิเคชันที่จำเป็นต้องกำหนดค่าเมื่อโหลดโมดูล การดำเนินการ "config" จะใช้การแทรกการอ้างอิง
นี่เป็นวิธีที่วัตถุใช้เพื่อยึดการพึ่งพาของมัน
- โดยทั่วไปการใช้ตัวดำเนินการใหม่สามารถสร้างการอ้างอิงได้
- เมื่ออ้างอิงถึงตัวแปรร่วม จึงสามารถค้นหาการขึ้นต่อกันได้
- การพึ่งพาสามารถส่งผ่านไปยังที่ที่จำเป็นได้
คำถามและคำตอบสัมภาษณ์ AngularJS สำหรับมืออาชีพที่มีประสบการณ์
21) อธิบายแนวคิดเรื่องลำดับชั้นขอบเขต
แอปพลิเคชันเชิงมุมแต่ละอันประกอบด้วยขอบเขตรากหนึ่งขอบเขตแต่สามารถมีขอบเขตย่อยได้หลายขอบเขต เมื่อตัวควบคุมย่อยและคำสั่งบางคำสั่งสร้างขอบเขตย่อยใหม่ แอปพลิเคชันสามารถมีขอบเขตได้หลายขอบเขต เมื่อมีการสร้างหรือสร้างขอบเขตใหม่ ขอบเขตเหล่านี้จะถูกเพิ่มเป็นขอบเขตย่อยของขอบเขตหลัก นอกจากนี้ ขอบเขตยังสร้างโครงสร้างแบบลำดับชั้นที่คล้ายกับ DOM อีกด้วย
22) อธิบายความแตกต่างที่สำคัญระหว่าง AngularJS และ backbone.js
AngularJS | backbone.js |
AngularJS คือ Javaกรอบงานโอเพ่นซอร์สที่ใช้สคริปต์ซึ่งได้รับการออกแบบเพื่อรองรับแอปพลิเคชันเว็บแบบไดนามิก | backbone.js เป็นเฟรมเวิร์กที่สรุป DOM ลงในมุมมองและข้อมูลลงในโมเดล จากนั้นเชื่อมโยงทั้งสองอย่างโดยใช้เหตุการณ์ |
ประสิทธิภาพการทำงานดีเนื่องจากมีกระบวนการผูกข้อมูลแบบสองทาง | เทคโนโลยี Backbone.js ให้ประสิทธิภาพที่เร็วกว่า AngularJS หากชุดข้อมูลมีขนาดเล็ก |
มันทำงานบน MVS (Multiple Virtual Storage) | ทำงานบนสถาปัตยกรรม MVP |
AngularJS ใช้แอตทริบิวต์ HTML แบบไดนามิกเพื่อทำให้แอปพลิเคชันเข้าใจง่าย | Backbone.js ใช้เทมเพลตขีดล่างเพื่อทำความเข้าใจแอปพลิเคชัน |
มีการสนับสนุนจากชุมชนจำนวนมาก | การสนับสนุนชุมชนถูกจำกัดให้อยู่ในเทมเพลตขีดล่างเท่านั้น |
23) ใครเป็นผู้สร้าง Angular JS
AngularJS ได้รับการพัฒนาโดย Adam Abrons และ Misko Hevery ปัจจุบันได้รับการพัฒนาโดย Google
24) คุณจะรวม AngularJS กับ HTML ได้อย่างไร?
นักพัฒนาสามารถทำตามขั้นตอนต่อไปนี้เพื่อรวม AngularJS เข้ากับ HTML:
ขั้นตอนที่ 1: รวมถึง AngularJS Javaสคริปต์ในหน้า html
<head> <script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script> </head>
ขั้นตอนที่ 2: ชี้ให้เห็นแอปพลิเคชัน AngularJS
คุณต้องเพิ่มแอตทริบิวต์ ng-app ภายในแท็ก body ของ HTML เพื่อบอกว่าแอป AngularJS ของ HTML มีส่วนใดอยู่ ดังที่แสดงในตัวอย่างต่อไปนี้:
<body ng-app = "testapp"> </body>
25) ตัวกรอง orderby ใน AngularJS คืออะไร?
ตัวกรอง Orderby ใน AngularJS จะเรียงลำดับอาร์เรย์ตามเกณฑ์ที่ระบุ ตัวอย่างต่อไปนี้จะระบุวิธีการเรียงลำดับผลิตภัณฑ์ตามราคา
<ul> <li ng-repeat = "company in product.products | orderBy:'price"> {{ company.product + ', price:' + product.price }} </li> </ul>
26) ng-non-bindable ใน AngularJS คืออะไร?
Ng-non-bindable ระบุ AngularJs ที่จะไม่รวบรวมองค์ประกอบ HTML และโหนดย่อย ตัวอย่างเช่น:
<title ng-non-bindable > </title>
27) อธิบายการใช้เหตุการณ์ดับเบิลคลิกใน AngularJS
เหตุการณ์ดับเบิลคลิกของ AgularJS ช่วยให้คุณสามารถระบุพฤติกรรมที่กำหนดเองในเหตุการณ์ดับเบิลคลิกของเมาส์บนหน้าเว็บ เช่น:
<ELEMENT ng-dblclick="{expression}"> ... </ELEMENT>
28) อธิบายคำสั่ง ng-click ใน AngularJS พร้อมตัวอย่าง
สามารถใช้คำสั่ง Ng-click ในสถานการณ์ที่คุณต้องคลิกปุ่มหรือต้องการดำเนินการใดๆ
ตัวอย่าง:
<button ng-click="count = count ++">Click</button>
29) เหตุใดจึงต้องใช้ ng-include ใน AngularJS
Ng-include ใน AngularJS ช่วยให้คุณฝังหน้า HTML ภายในหน้า HTML เดียว ตัวอย่าง:
<div ng-app = "" ng-controller = "interviewController"> <div ng-include = "'first.htm'"></div> <div ng-include = "'phases.htm'"></div> </div>
30) คุณจะโทร ajax โดยใช้ Angular JS ได้อย่างไร
AngularJS นำเสนอการควบคุม $https: ที่ช่วยให้คุณเรียกใช้ ajax เพื่ออ่านข้อมูลเซิร์ฟเวอร์ เซิร์ฟเวอร์จะเรียกใช้ฐานข้อมูลเพื่อรับข้อมูลที่จำเป็น เมื่อข้อมูลของคุณในรูปแบบ JSON พร้อมแล้ว คุณสามารถใช้ $https: เพื่อดึงข้อมูลจากเซิร์ฟเวอร์ได้ในลักษณะต่อไปนี้:
function employeeController($scope,$https:) { var url = "tasks.txt"; $https.get(url).success( function(response) { $scope.employee = response; }); }
31) อธิบายการใช้ $routeProvider
ใน Angular JS $routeProvider ตั้งค่าการกำหนดค่า URL มันแมปกับเทมเพลต ng หรือหน้า HTML ที่เกี่ยวข้องและแนบคอนโทรลเลอร์ด้วยสิ่งเดียวกัน
32) คุณจะตั้งค่า รับ และล้างคุกกี้ใน AngularJS ได้อย่างไร
คุณสามารถใช้ได้:
- $cookies.put() วิธีการตั้งค่าคุกกี้
- $cookies.get() วิธีการรับคุกกี้
- $cookies.remove เพื่อลบคุกกี้ใน AngularJS
33) วิธีการให้บริการคืออะไร?
วิธีการบริการใน AngularJS ช่วยให้คุณสามารถกำหนดบริการและวิธีการให้กับบริการนั้นได้ ในตัวอย่างต่อไปนี้ เราได้เพิ่มบริการการบวกแบบง่ายซึ่งจะบวกตัวเลขสองตัวเข้าด้วยกัน
<! DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Event Registration</title> </head> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> <body> <h3> Guru99 Global Event</h3> <div ng-app = "mainApp" ng-controller = "DemoController"> <p>Result: {{result}}</p> </div> <script> var mainApp = angular.module("mainApp", []); mainApp.service('AdditionService', function(){ this.ADDITION = function(a,b) { return a+b; } }); mainApp.controller('DemoController', function($scope, AdditionService) { $scope.result = AdditionService.ADDITION(5,6); }); </script> </body> </html>
34) ตั้งชื่อส่วนประกอบ AngularJS ที่สามารถฉีดเป็นการพึ่งพาได้
ส่วนประกอบ AngularJS ที่สามารถฉีดเป็นการพึ่งพาได้คือ: 1) ค่า 2) โรงงาน 3) บริการ 4) ผู้ให้บริการ 5) ค่าคงที่
35) ฟังก์ชั่น Angular Global API ทั่วไปคืออะไร
ฟังก์ชัน Angular Global API ที่ใช้กันทั่วไปบางส่วน ได้แก่:
- เชิงมุม.isString: มันจะคืนค่าเป็นจริงเฉพาะในกรณีที่การอ้างอิงที่ระบุเป็นประเภทสตริง
- เชิงมุมตัวพิมพ์เล็ก: มันจะแปลงสตริงใด ๆ เป็นตัวพิมพ์เล็ก
- เชิงมุมตัวพิมพ์ใหญ่: มันจะแปลงสตริงใด ๆ เป็นตัวพิมพ์ใหญ่
- Angular.isNumber: มันจะคืนค่าจริงเฉพาะในกรณีที่การอ้างอิงเป็นค่าตัวเลขหรือตัวเลข
36) เขียนโปรแกรมเพื่อซ่อนแท็ก HTML เพียงคลิกปุ่มเดียวในรูปแบบเชิงมุม
<!DOCTYPE html> <html> <head> <meta chrset="UTF 8"> <title>Event Registration</title> </head> <body> <script src="https://code.angularjs.org/1.6.9/angular.js"></script> <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script> <h1> Guru99 Global Event</h1> <div ng-app="DemoApp" ng-controller="DemoController"> <input type="button" value="Hide Angular" ng-click="ShowHide()"/> <br><br><div ng-hide="IsVisible">Angular</div> </div> <script type="text/javascript"> var app = angular.module('DemoApp',[]); app.controller('DemoController',function($scope){ $scope.IsVisible = false; $scope.ShowHide = function(){ $scope.IsVisible = $scope.IsVisible = true; } }); </script> </body> </html>
37) BOM (Browser Object Model) คืออะไร
BOM หรือโมเดลออบเจ็กต์เบราว์เซอร์ประกอบด้วยประวัติ ตัวนำทางออบเจ็กต์ ตำแหน่งหน้าจอ ฯลฯ โดยจะระบุออบเจ็กต์เบราว์เซอร์ส่วนกลาง เช่น คอนโซล ที่จัดเก็บในเครื่อง และหน้าต่าง
38) อธิบาย “$rootScope” ใน AngularJS
“$rootScope” คือขอบเขตที่สร้างขึ้นในองค์ประกอบ DOM (Document Object Model)
แอปพลิเคชันสามารถมี $rootScope เดียวที่แชร์กับส่วนประกอบอื่นๆ ได้ โดยมีไดเร็กทิฟ ng-app ส่วนขอบเขตอื่นๆ จะถูกเรียกว่าเป็นขอบเขตย่อย แอปพลิเคชันสามารถเฝ้าดูการแสดงออกและเผยแพร่เหตุการณ์ได้
39) ยกตัวอย่าง ng-view ใน Angular
พิจารณาตัวอย่างต่อไปนี้:
<!DOCTYPE html> <html> <head> <meta chrset="UTF 8"> <title>Event Registration</title> <script src="https://code.angularjs.org/1.5.9/angular-route.js"></script> <script src="https://code.angularjs.org/1.5.9/angular.min.js"></script> <script src="lib/bootstrap.js"></script> </head> <body ng-app="sampleApp"> <h1> Global Event</h1> <div class="container"> <ul><li><a href="#!NewEvent"> Add New Event</a></li> <li><a href="#!DisplayEvent"> Display Event</a></li> </ul> <div ng-view></div> </div> <script> var app = angular.module('sampleApp',["ngRoute"]); app.config(function($routeProvider){ $routeProvider. when("/NewEvent",{ templateUrl : "add_event.html", controller: "AddEventController" }). when("/DisplayEvent", { templateUrl: "show_event.html", controller: "ShowDisplayController" }). otherwise ({ redirectTo: '/DisplayEvent' }); }); app.controller("AddEventController", function($scope) { $scope.message = "This is to Add a new Event"; }); app.controller("ShowDisplayController",function($scope){ $scope.message = "This is display an Event"; }); </script> </body> </html>
40) ไวยากรณ์ของวิธีโรงงานใน AngularJS คืออะไร?
ไวยากรณ์ของ Factory เป็นดังนี้:
app.factory('serviceName',function(){ return serviceObj;})
41) ตั้งชื่อเฟสต่างๆ ของวงจรการใช้งานขอบเขต AngularJS
ต่อไปนี้เป็นขั้นตอนต่างๆ ของวงจรการใช้งานขอบเขต AngularJS:
- การสร้าง
- การกลายพันธุ์ของโมเดล
- การลงทะเบียนผู้เฝ้าดู
- การสังเกตการกลายพันธุ์
- การทำลายขอบเขต
42) เขียนโปรแกรมเพื่อบูตกระบวนการใน Angular
โปรแกรมสำหรับบูตกระบวนการใน Angular คือ:
<html> <body ng-app="TestApp"> <div ng-controller="Ctrl">Hi{{msg}}!</div> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.7.8/angular.min.js"> </script> <script> var test = angular.module('TestApp', []); test.controller('Ctrl', function($scope) { $scope.msg = 'Good Morning'; }); </script> </body> </html>
43) แอปพลิเคชันหน้าเดียวใน AngularJS คืออะไร
SPA หรือแอปพลิเคชันหน้าเดียวคือเว็บไซต์หรือเว็บแอปพลิเคชันที่มีการโต้ตอบกับผู้ใช้แบบไดนามิก ใน AngularJS Javaสคริปต์ HTML และ CSS พอดีกับหน้าเดียว ทำหน้าที่นำทางโดยไม่ต้องรีเฟรชหน้า HTML ทั้งหมด
44) อธิบายแนวคิดของ webpack
Webpack เป็นตัวรวมโมดูลสำหรับ Angular2 หรือสูงกว่า มันรวมกลุ่ม transpiles และลดขนาดแอปพลิเคชัน AngularJS
45) NPM คุณหมายถึงอะไร?
NPM ย่อมาจาก Node Package Manager ประกอบด้วยไคลเอนต์เครื่องมือบรรทัดคำสั่งสำหรับการโต้ตอบกับที่เก็บของโปรเจ็กต์ Node.js
46) คุณจะสร้างโปรเจ็กต์ใหม่ใน angularJS โดยใช้ Command Line Interface ได้อย่างไร
เมื่อคุณติดตั้งอินเทอร์เฟซบรรทัดคำสั่งของ Angular คุณจะต้องรันคำสั่งชื่อโปรเจ็กต์ใหม่เพื่อสร้างโปรเจ็กต์ใหม่ใน Angular
47) อธิบายกระบวนการบูตอัตโนมัติใน AngularJS
Angular เริ่มต้นเหตุการณ์ DOMContentLoaded โดยอัตโนมัติหรือเมื่อคุณดาวน์โหลดสคริปต์ angular.js ไปยังเบราว์เซอร์
หลังจากนั้น AngularJS จะค้นหาไดเร็กทิฟ ng-app ซึ่งเป็นรากของการคอมไพล์แอปพลิเคชัน Angular เมื่อพบไดเร็กทิฟ ng-app แล้ว AngularJS จะดำเนินการตามขั้นตอนต่อไปนี้:
1) โหลดโมดูลซึ่งเกี่ยวข้องกับคำสั่ง
2) สร้างแอปพลิเคชันหัวฉีด
3) รวบรวม DOM จากองค์ประกอบรูท ng-app กระบวนการนี้เรียกว่าการบูตเครื่องอัตโนมัติ
48) นิพจน์ฟังก์ชันที่เรียกใช้ทันทีคืออะไร?
IIFEs หรือนิพจน์ฟังก์ชันที่เรียกใช้ทันทีคือฟังก์ชันที่ดำเนินการทันทีที่ถูกสร้างขึ้น มันนำเสนอวิธีง่ายๆ ในการแยกการประกาศตัวแปร IIFEs มีหน้าที่หลักสองประการ:
1) ตัวดำเนินการ()
2) การแสดงออก()
49) วงจรการแยกย่อยใน AngularJS คืออะไร?
วงจรการแยกย่อยเป็นส่วนสำคัญของการเชื่อมโยงข้อมูลใน AngularJS ซึ่ง เปรียบเทียบเวอร์ชันเก่าและเวอร์ชันใหม่ของโมเดลขอบเขต วงจรไดเจสต์จะถูกเรียกใช้โดยอัตโนมัติหรือด้วยตนเองโดยใช้ฟังก์ชัน $apply()
50) ข้อกำหนดพื้นฐานในการทำงานกับ AngularJS คืออะไร?
คุณต้องดาวน์โหลด AngularJS เวอร์ชันล่าสุดจาก AngularJS.com เพื่อเรียนรู้หรือทำงานกับ AngularJS คุณอาจต้องการไฟล์ JS และโฮสต์ไว้ในเครื่อง หรือคุณสามารถใช้ google CDN (Content Delivery Network) เพื่ออ้างอิงได้
51) เราสามารถสร้างคอนโทรลเลอร์แบบซ้อนใน AngularJS ได้หรือไม่?
ใช่ เราสามารถสร้าง Nested Controller ใน AngularJS ได้
ตัวอย่างของ Nested Controller มีดังนี้:
<div ng-controller="MainCtrl"> <p>{{msg}} {{name}}!</p> <div ng-controller="SubCtrl1"> <p>Hi {{name}}!</p> <div ng-controller="SubCtrl2"> <p>{{msg}} {{name}}! Your name is {{name}}.</p> </div> </div> </div>
52) การรับรองความถูกต้องคืออะไร?
การรับรองความถูกต้องเป็นบริการที่ใช้ในการเข้าสู่ระบบและออกจากระบบแอปพลิเคชัน Angular ข้อมูลประจำตัวของผู้ใช้ส่งผ่านไปยัง API บนเซิร์ฟเวอร์ จากนั้นโพสต์การตรวจสอบความถูกต้องฝั่งเซิร์ฟเวอร์ JSON Web Token จะถูกส่งคืน ซึ่งเป็นรายละเอียดเกี่ยวกับผู้ใช้ปัจจุบัน
53) กำหนดวัสดุ AngularJS
AngularJS Material เป็นการดำเนินการตามข้อกำหนดการออกแบบวัสดุของ Google มีชุดส่วนประกอบ UI ที่ผ่านการทดสอบอย่างดีและสามารถนำมาใช้ซ้ำได้สำหรับโปรแกรมเมอร์ AngularJS
54) อะไรคือความแตกต่างที่สำคัญระหว่าง Angular 7 และ Angular 8
7 เชิงมุม | 8 เชิงมุม |
Angular 7 ใช้งานยาก | Angular 8 ใช้งานง่ายมาก |
ให้การสนับสนุนภาษาการเขียนโปรแกรม Typescript 3.4 เวอร์ชันต่ำกว่า | ไม่รองรับภาษาการเขียนโปรแกรม Typescript 3.4 เวอร์ชันต่ำกว่า |
รองรับทุกเวอร์ชันของ Node.js | รองรับเฉพาะเวอร์ชัน Node.js 12 |
55) ngzone คืออะไร?
ngzone คือ Javaคลาสตัวห่อสคริปต์ซึ่งแสดงโดย Zone.js ช่วยให้นักพัฒนาสามารถเรียกใช้โค้ดบางตัวได้อย่างชัดเจนนอกโซนของ Angular ซึ่งจะยับยั้งเชิงมุมให้เรียกใช้การตรวจจับการเปลี่ยนแปลงใด ๆ
56) แสดงรายการความแตกต่างระหว่าง Angular Component และ Directive
ตัวแทน | สั่ง |
ส่วนประกอบเชิงมุมเป็นคำสั่งที่ช่วยให้คุณสามารถใช้ฟังก์ชันการทำงานของส่วนประกอบของเว็บได้ทั่วทั้งแอปพลิเคชัน | คำสั่งเชิงมุมเป็นเทคนิคที่เราแนบพฤติกรรมกับองค์ประกอบต่างๆ |
ช่วยให้คุณแบ่งแอปพลิเคชันของคุณออกเป็นส่วนประกอบย่อยๆ | ช่วยให้คุณออกแบบส่วนประกอบที่นำมาใช้ซ้ำได้ |
สามารถกำหนดท่อได้ | มันไม่สามารถกำหนดท่อได้ |
57) กำหนด ECMAScript
ECMAScript (European Computer Manufacturing's Association) เป็นมาตรฐานสำหรับภาษาสคริปต์ Javaสคริปต์ใช้ ECMAScript เป็นภาษาหลัก นักพัฒนาสามารถใช้ ECMAScript ช่วยเขียนสคริปต์ฝั่งไคลเอนต์บนเว็บและ/หรือแอปพลิเคชันและบริการเซิร์ฟเวอร์ ECMAScript มีคุณสมบัติมากมาย เช่น คุณสมบัติเชิงฟังก์ชัน ต้นแบบ ไดนามิก และโครงสร้าง
58) Traceur Compiler คืออะไร?
เทรเซอร์เป็น Javaสคริปต์คอมไพเลอร์ที่ใช้คลาส ตัวสร้าง และคุณลักษณะอื่น ๆ จาก ECMAScript
59) จะแปลงสตริงเป็นสกุลเงินได้อย่างไร?
คุณสามารถแปลงอินพุตสตริงเป็นตัวกรองสกุลเงินประเภทสกุลเงินใน Angular
60) เทมเพลตใน AngularJS คืออะไร?
เทมเพลตคือไฟล์ HTML ที่ใช้กับคำสั่งและแอตทริบิวต์ AngularJs
61) อธิบายความแตกต่างระหว่าง Angular และ jQuery
AngularJS | JQuery |
AngularJs เข้าใจยาก | Jquery เข้าใจง่ายมาก |
รองรับกระบวนการผูกสองทาง | ไม่รองรับกระบวนการผูกข้อมูล |
ให้การสนับสนุนการกำหนดเส้นทางการเชื่อมโยงในเชิงลึก | ไม่รองรับการกำหนดเส้นทางลิงก์ในรายละเอียด |
62) การรวบรวมล่วงหน้าคืออะไร?
Angular AOT (Ahead of Time) คือคอมไพเลอร์ที่แปลงโค้ด Angular HTML และ TypeScript ของคุณเป็น Javaโค้ดสคริปต์
63) รายการประเภทของตัวกรองใน AngularJS
ประเภทของตัวกรองที่ใช้ใน AngularJS ได้แก่ 1) สกุลเงิน 2) ตัวพิมพ์ใหญ่ 3) ตัวพิมพ์เล็ก 4) orderBy 5) JSON และ 6) LimitTo
64) อธิบายฟังก์ชัน ngOnInit ()
ฟังก์ชัน ngOnInit () เป็น hook วงจรชีวิตซึ่งถูกเรียกหลังจากเสร็จสิ้นคุณสมบัติผูกข้อมูลของคำสั่ง
65) การแปลใน AngularJS คืออะไร?
การรวมใน AngulaJS ช่วยให้นักพัฒนาสามารถจัดสรรไดเรกทิฟลูกเดิมใหม่ไปยังตำแหน่งเฉพาะภายในเทมเพลตได้ ไดเรกทิฟ ng แสดงจุดแทรกสำหรับ DOM ที่รวมแล้วของไดเรกทิฟหลักที่ใกล้ที่สุด ซึ่งใช้การรวม ไดเรกทิฟ Ng-transclude-slot หรือ ng-transclude ใช้เพื่อการรวมเป็นหลัก
66) Hooks ที่มีไฟส่องสว่างมีอยู่ใน AngularJS
hooks ต่างๆ ใน AngularJS ได้แก่:
1) ngOnInit ()
2) ngOnChanges ()
3) ngDoCheck()
4) ngAfterContentInit(),
5) ngAfterContentChecked(),
6) ngOnDestroy(),
7) ngAfterViewChecked() และ
8) ngAfterViewInit()
67) ส่วนสำคัญของข้อมูลเมตาของ AngularJS คืออะไร?
ข้อมูลเมตา AngularJS ใช้ในการตกแต่งคลาสที่แสดงถึงพฤติกรรมที่คาดหวังของคลาสใดคลาสหนึ่ง ส่วนต่างๆ ของเมตาดาต้าได้แก่: 1) ตัวตกแต่งคลาส 2) ตัวตกแต่งเมธอด ตัวตกแต่งพารามิเตอร์ และ 4) ตัวตกแต่งคุณสมบัติ
68) Angular CLI คืออะไร
Angular CLI เรียกอีกอย่างว่าเป็นเครื่องมืออินเทอร์เฟซบรรทัดคำสั่ง ใช้เพื่อสร้าง เริ่มต้น และบำรุงรักษาแอป Angular ซอฟต์แวร์ CLI สามารถใช้งานได้ผ่าน UI แบบโต้ตอบ เช่น command shell หรือ Angular Console
69) อธิบายไปป์แบบกำหนดพารามิเตอร์ใน AngularJS
ใน เชิงมุมJS ไพพ์สามารถมีพารามิเตอร์ได้มากกว่าหนึ่งพารามิเตอร์เพื่อปรับแต่งเอาต์พุตแบบละเอียด คุณสามารถสร้างไปป์แบบกำหนดพารามิเตอร์ได้โดยการประกาศไปป์ด้วยโคลอน (:) และค่าของพารามิเตอร์ นักพัฒนาสามารถแยกค่าพารามิเตอร์หลายค่าด้วยโคลอน (:)
70) การกำหนดเส้นทางคืออะไร?
การกำหนดเส้นทางเป็นวิธีการรวมมุมมองต่างๆ ผู้ควบคุมจะตัดสินใจรวมมุมมองเหล่านี้เข้าด้วยกันโดยขึ้นอยู่กับความต้องการเชิงตรรกะ
71) การทดสอบหน่วยแยก คุณหมายถึงอะไร?
การทดสอบแบบแยกเป็นกระบวนการในการตรวจสอบอินสแตนซ์ของคลาสโดยไม่ต้องใช้ค่าที่แทรกหรือการพึ่งพาเชิงมุม ช่วยให้คุณใช้งานโปรแกรมได้อย่างง่ายดาย
72) ตั้งชื่อฟังก์ชันภาพเคลื่อนไหว DSL ใน AngularJS
ฟังก์ชั่นแอนิเมชั่น DSL ใน AngularJS คือ: 1) group(), 2) state(), 3) transition(), 4) style(), 5) keyframes(), 6) trigger(), 7) sequence() และ 8) เคลื่อนไหว()
73) โมดูล AngularJS คืออะไร?
ใน เชิงมุมJS โมดูลคือกระบวนการในการจัดกลุ่มคำสั่งและส่วนประกอบบริการที่เกี่ยวข้อง โดยจัดเรียงในลักษณะที่สามารถผสมกับโมดูลอื่นๆ เพื่อสร้างแอปพลิเคชันได้
74) ไปป์ใน AngularJs คืออะไร?
ในเชิงมุม ไปป์เป็นวิธีง่ายๆ ในการแปลงข้อมูล โดยจะใช้ค่าต่างๆ เช่น อาร์เรย์ จำนวนเต็ม ข้อมูล และสตริงเป็นอินพุตและหารด้วยสัญลักษณ์ไปป์ (|) มันจะแปลงข้อมูลในรูปแบบที่ต้องการ Pipes จะแสดงสิ่งเดียวกันในเบราว์เซอร์ ใน AngularJS นั้นจะมีไพพ์ในตัวอยู่บ้าง แต่นักพัฒนาก็สามารถพัฒนาไพพ์ของตัวเองได้เช่นกัน
75) อธิบาย ViewEncapsulation ใน AngularJS
ViewEncapsulation กำหนดว่าสไตล์ที่กำหนดไว้ในองค์ประกอบ AngularJS จะส่งผลกระทบต่อแอปทั้งหมดหรือไม่
เตรียมตัวสัมภาษณ์งาน!!! ผ่าน กวดวิชา AngularJS เพื่อเตรียมตัวให้ดียิ่งขึ้น
การทดสอบจำลอง AngularJS แบบละเอียดนี้จะช่วยให้คุณคลายข้อสงสัยเกี่ยวกับคำถามสัมภาษณ์ AngularJS และยังช่วยให้คุณถอดรหัสการสัมภาษณ์ได้อีกด้วย
คำถามสัมภาษณ์เหล่านี้จะช่วยในวีว่าของคุณ (วาจา)