Angular 2 - โมดูล

โมดูลใช้ใน Angular JS เพื่อวางขอบเขตตรรกะในแอปพลิเคชันของคุณ ดังนั้นแทนที่จะเข้ารหัสทุกอย่างลงในแอปพลิเคชันเดียวคุณสามารถสร้างทุกอย่างเป็นโมดูลแยกต่างหากเพื่อแยกการทำงานของแอปพลิเคชันของคุณ มาตรวจสอบโค้ดที่เพิ่มลงในแอปพลิเคชันสาธิตกัน

ในรหัส Visual Studio ไปที่โฟลเดอร์ app.module.ts ในโฟลเดอร์แอปของคุณ สิ่งนี้เรียกว่าคลาสโมดูลรูท

รหัสต่อไปนี้จะปรากฏในไฟล์ app.module.ts ไฟล์.

import { NgModule }      from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser';  
import { AppComponent }  from './app.component';  

@NgModule ({ 
   imports:      [ BrowserModule ], 
   declarations: [ AppComponent ], 
   bootstrap:    [ AppComponent ] 
}) 
export class AppModule { }

มาดูรายละเอียดของโค้ดแต่ละบรรทัดกัน

• คำสั่งนำเข้าใช้เพื่ออิมพอร์ตฟังก์ชันจากโมดูลที่มีอยู่ ดังนั้น 3 คำสั่งแรกจึงใช้เพื่ออิมพอร์ตโมดูล NgModule, BrowserModule และ AppComponent ลงในโมดูลนี้

• มัณฑนากร NgModule ใช้เพื่อกำหนดตัวเลือกการนำเข้าการประกาศและการบูตในภายหลัง

• BrowserModule เป็นสิ่งจำเป็นโดยค่าเริ่มต้นสำหรับแอปพลิเคชันเชิงมุมบนเว็บ

• ตัวเลือก bootstrap จะบอก Angular ว่าคอมโพเนนต์ใดที่จะบูตสแตรปในแอปพลิเคชัน

โมดูลประกอบด้วยส่วนต่างๆดังต่อไปนี้ -

• Bootstrap array- ใช้เพื่อบอก Angular JS ว่าต้องโหลดส่วนประกอบใดเพื่อให้สามารถเข้าถึงฟังก์ชันการทำงานในแอปพลิเคชันได้ เมื่อคุณรวมคอมโพเนนต์ในอาร์เรย์ bootstrap คุณจะต้องประกาศเพื่อให้สามารถใช้กับส่วนประกอบอื่น ๆ ในแอปพลิเคชัน Angular JS ได้

• Export array - ใช้เพื่อส่งออกส่วนประกอบคำสั่งและท่อซึ่งสามารถใช้ในโมดูลอื่น ๆ ได้

• Import array - เช่นเดียวกับอาร์เรย์การส่งออกสามารถใช้อาร์เรย์นำเข้าเพื่อนำเข้าฟังก์ชันจากโมดูล Angular JS อื่น ๆ