>  기사  >  웹 프론트엔드  >  Anglejs의 적용 시나리오는 무엇입니까? Anglejs의 응용 시나리오 소개

Anglejs의 적용 시나리오는 무엇입니까? Anglejs의 응용 시나리오 소개

寻∝梦
寻∝梦원래의
2018-09-06 14:27:182737검색

이 글은 주로Angularjs의 적용 시나리오에 대해 설명합니다. 내용이 많지 않으므로 모두가 함께 읽어보시기 바랍니다.

우선,angularjs의 응용 시나리오 설명에 대해 이야기해 보겠습니다.

AngularJS의 작동 원리는 다음과 같습니다. HTML 템플릿은 브라우저에서 구문 분석됩니다. DOM, DOM 구조는 AngularJS 컴파일러에 대한 입력이 됩니다. AngularJS는 DOM 템플릿을 탐색하여 해당 NG 명령어를 생성합니다. 모든 명령어는 뷰(즉, HTML의 ng-model)에 대한 데이터 바인딩 설정을 담당합니다. 따라서 NG 프레임워크는 DOM이 로드된 후에만 작동하기 시작합니다. 이는 대형 브라우저와 대형 웹사이트 프로젝트에서 시도되었습니다.

이제 Anglejs의 애플리케이션 시나리오에 대해 이야기해 보겠습니다.

Angular는 많은 프로그래머가 구축하고 사용하는 인기 있는 엔터프라이즈 수준 프레임워크입니다. 복잡한 웹 애플리케이션을 유지 관리합니다. Angular는 엄청난 인기를 누리고 있으며 Domino's Pizza(Ryanair, iTunes Connect, PayPal Checkout, Google)와 같은 많은 회사에서 사용됩니다. Angular는 Google에서 제공하는 오픈소스 프레임워크입니다. Angular는 복잡한 웹 애플리케이션을 구축하기 위해 스스로를 HTML의 확장이라고 부릅니다. TypeScript에도 익숙하다면 Angular 2 작성 방법을 살펴보세요.


Angular는 MVC 아키텍처를 채택합니다. Model 계층과 View 계층 사이에 이중 데이터 바인딩을 제공합니다. 이 데이터 바인딩 방법의 장점은 데이터의 어느 쪽이 변경되더라도 양쪽의 데이터가 자동으로 업데이트된다는 것입니다. 이는 소비 가능한 View 구성 요소를 구축하는 데 도움이 됩니다. 또한 프런트엔드 서비스와 백엔드 서비스 간의 쉬운 상호 작용을 위한 서비스 프레임워크를 제공합니다. 무엇보다도 간단한 JavaScript입니다.

AngularJS를 언제 사용해야 할까요? 복잡한 웹 프런트 엔드 애플리케이션을 구축하고 모든 것을 처리하기 위해 단일 모듈 프레임워크가 필요한 경우.

angularjs 애플리케이션 소개:

angular 애플리케이션: HTML을 각도 확장 구문과 함께 사용하여 템플릿을 작성하고, 구성 요소 클래스를 사용하여 이러한 템플릿을 관리합니다. 사용 서비스는 애플리케이션 논리를 추가하고 구성 요소와 서비스를 모듈로 패키징하고 게시합니다. 루트 모듈을 부팅하여 애플리케이션을 시작합니다. Angular는 브라우저에 애플리케이션 콘텐츠를 인계 받아 표시하고 우리가 제공하는 작업 지침에 따라 사용자 상호 작용에 응답합니다.

이 용어는 매우 중요하며 Angular 애플리케이션 개발을 통해 실행됩니다. (Angularjs에 대해 더 자세히 알고 싶다면 PHP 중국어 웹사이트

AngularJS 참조 매뉴얼 열을 방문하세요.)

Angular 애플리케이션의 8가지 주요 구성 요소:

  • modulesmodules

  • 구성 요소 구성 요소

    # 🎜 🎜 ####templateTemplate#🎜🎜 ## ## ## #######metadatametadata#🎜🎜 ## ## #####data bindingdata 바인딩#🎜 🎜 ## 🎜🎜#
  • directive

  • service services

  • 종속성 주입

    # 🎜🎜#

  • angular의 모듈:

  • angular 애플리케이션은 모듈식이며 자체 모듈을 갖습니다. 모듈 시스템을 각도 모듈/NgModules이라고 합니다.
  • 모듈이란 정확히 무엇인가요? 각도에서 모듈성은 무엇을 의미합니까?

  • angular 애플리케이션에는 AppModule이라는 모듈(루트 모듈)이 하나 이상 있습니다.
  • 대부분의 애플리케이션에는 도메인 클래스, 워크플로 또는 밀접하게 관련된 기능 집합 집합으로 구성된 다른 많은 기능 모듈이 있습니다.

  • Angular의 모든 모듈은 @NgModule 데코레이터가 있는 클래스입니다.

angular의 모듈은 클래스입니다! ! !

Decorators는 JavaScript 클래스를 장식하는 데 사용되는 함수입니다. 클래스에 메타데이터를 첨부하는 일을 담당합니다.

NgModule은 모듈 속성을 설명하는 메타데이터 개체를 받는 데코레이터 함수입니다. 속성은 다음과 같습니다:

declarations: 이 모듈에 소유된 클래스를 봅니다. Angular에는 구성 요소, 지시문 및 파이프라인이라는 세 가지 보기 클래스가 있습니다.

exports: 다른 모듈의 구성 요소 템플릿에 사용할 수 있는 선언의 하위 집합입니다.

    imports: 이 모듈의 구성 요소 템플릿에 있는 클래스는 다른 템플릿에서 내보내야 합니다.
  • providers: 서비스 제작자. 이 모듈은 애플리케이션의 어느 부분에서든 액세스할 수 있도록 이를 글로벌 서비스 테이블에 추가합니다.
  • bootstrap: 애플리케이션의 기본 보기(루트 구성 요소)를 식별합니다. 루트 모듈만 이 속성을 설정할 수 있습니다.
  • 다음은 간단한 루트 모듈입니다.

    // app.module.ts
    import { NgModule }   from '@angular/core';
    import { BrowserModule } from '@angular/platform-browser';
    // @NgModle 装饰器函数,接受一个对象,对象有几个属性
    @NgModule({
     imports:   [ BrowserModule ],
     providers:  [ Logger ],
     declarations: [ AppComponent ],
     exports:   [ AppComponent ],
     bootstrap:  [ AppComponent ]
    })
    // AppComponent 的 export 语句导出,根模块不需要导出,其他组件不需导入根模块。
    export class AppModule { }
  • 루트 모듈을 부트스트랩하여 응용 프로그램을 시작합니다. main.ts 파일에서 AppModule을 안내합니다.
  • // app/main.ts
    import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
    // 从app.module 文件导入了 AppModule
    import { AppModule } from './app.module';
    platformBrowserDynamic().bootstrapModule(AppModule);

    현재 프로젝트에는 app/app.module.ts 파일만 있고 app/main.ts는 루트 모듈을 정의합니다. 애플리케이션은 이를 참조하고 애플리케이션을 시작합니다.

  • 좋아요, 여기까지가 Anglejs의 적용 시나리오와 적용에 대한 기사입니다. (Angularjs에 대해 더 자세히 알고 싶다면 PHP 중국어 웹사이트를 추천합니다
  • AngularJS 학습 매뉴얼# 🎜🎜 #칼럼학습), 궁금한 점이 있으시면 아래에 메시지를 남겨주시면 됩니다.

    【에디터 추천】

Angularjs와 Vue의 차이점은 무엇인가요? Anglejs와 Vue의 비교 세부정보

Angularjs의 장점은 무엇인가요? 꼭 알아야 할 Anglejs의 7가지 장점을 소개합니다

위 내용은 Anglejs의 적용 시나리오는 무엇입니까? Anglejs의 응용 시나리오 소개의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.