AngularJS란 무엇입니까? AngularJS_AngularJS 소개

AngularJS란 무엇인가요?

AngularJS는 동적 웹 애플리케이션용으로 설계된 구조적 프레임워크입니다. 이를 통해 HTML을 템플릿 언어로 사용할 수 있으며, HTML 구문을 확장하여 애플리케이션 구성 요소를 보다 명확하고 간결하게 구축할 수 있습니다. 그 혁신은 데이터 바인딩과 종속성 주입을 사용하여 많은 코드를 작성하지 않아도 된다는 것입니다. 이는 모두 브라우저 측 Javascript를 통해 구현되므로 모든 서버 측 기술과 완벽하게 통합됩니다.

AngularJS는 애플리케이션 구축 시 HTML의 단점을 극복하도록 설계되었습니다. HTML은 정적 텍스트 표시를 위해 설계된 훌륭한 선언적 언어이지만 웹 애플리케이션을 구축하는 데에는 취약합니다. 그래서 나는 브라우저가 내가 원하는 것을 할 수 있도록 몇 가지 작업(원한다면 트릭)을 수행했습니다. 형식날짜

일반적으로 동적 애플리케이션을 구축할 때 정적 웹페이지 기술의 단점을 해결하기 위해 다음 기술을 사용합니다.

1. 클래스 라이브러리 - 클래스 라이브러리는 웹 애플리케이션 작성에 도움이 되는 함수 모음입니다. 제어권을 갖는 것은 귀하의 코드이며 라이브러리를 언제 사용할지 결정하는 것은 귀하입니다. 클래스 라이브러리에는 jQuery 등이 포함됩니다.

2. 프레임워크 - 프레임워크는 이미 구현된 특별한 웹 애플리케이션입니다. 특정 비즈니스 로직으로만 채우면 됩니다. 여기서 프레임워크는 특정 애플리케이션 논리에 따라 코드를 호출하는 선도적인 역할을 합니다. 프레임워크에는 녹아웃, 새싹코어 등이 포함됩니다.

AngularJS는 애플리케이션 구축 시 HTML 자체의 단점을 보완하기 위해 다른 접근 방식을 사용합니다. AngularJS를 사용하면 브라우저가 지시문이라고 부르는 구조를 사용하여 새로운 구문을 인식할 수 있습니다. 예:

1. 데이터 바인딩에 이중 중괄호 {{}} 구문을 사용합니다. 2. DOM 제어 구조를 사용하여 DOM 조각을 반복하거나 숨깁니다.
3. 지원 양식 및 양식 유효성 검사
4. 관련 DOM 요소에 논리 코드를 연결하는 기능
5. HTML을 재사용 가능한 구성 요소로 그룹화하는 기능.

엔드 투 엔드 솔루션

AngularJS는 웹 애플리케이션을 위한 엔드 투 엔드 솔루션을 시도합니다. 이는 웹 애플리케이션의 작은 부분이 아니라 완전한 엔드투엔드 솔루션임을 의미합니다. 이렇게 하면 CRUD(생성 추가, 검색 쿼리, 업데이트 업데이트, 삭제 삭제) 애플리케이션을 구축할 때 AngularJS가 매우 "의견적"이 됩니다(원본 텍스트는 독단적이므로 다른 방법이 많지 않음을 의미). 그러나 "완고함"이 있더라도 응용 프로그램을 빌드할 때 "완고함"이 시작점에만 있음을 보장하고 여전히 변경할 수 있는 유연성을 제공합니다. AngularJS의 뛰어난 기능 중 일부는 다음과 같습니다.

1. CRUD 애플리케이션을 구축하는 데 사용할 수 있는 모든 것에는 데이터 바인딩, 기본 템플릿 식별자, 양식 유효성 검사, 라우팅, 딥 링크, 구성 요소 재사용 및 종속성 주입이 포함됩니다.

2. 테스트에는 단위 테스트, 엔드투엔드 테스트, 시뮬레이션 및 자동화된 테스트 프레임워크가 포함됩니다.
3. 디렉토리 레이아웃과 테스트 스크립트를 시작점으로 하여 애플리케이션을 시드합니다.

AngularJS의 귀여움

AngularJS는 개발자에게 더 높은 수준의 추상화를 제공하여 애플리케이션 개발을 단순화합니다. 다른 추상화 기술과 마찬가지로 일부 유연성이 손실됩니다. 즉, 모든 애플리케이션이 AngularJS에 적합한 것은 아닙니다. AngularJS는 주로 CRUD 애플리케이션 구축과 관련이 있습니다. 다행스럽게도 WEB 애플리케이션의 최소 90%는 CRUD 애플리케이션입니다. 하지만 AngularJS를 사용하여 빌드하는 데 적합한 것이 무엇인지 이해하려면 AngularJS를 사용하여 빌드하는 데 적합하지 않은 것이 무엇인지 이해해야 합니다.

예를 들어 게임, 그래픽 인터페이스 편집기, 빈번하고 복잡한 DOM 작업이 포함된 애플리케이션은 CRUD 애플리케이션과 매우 다르며 AngularJS로 구축하기에 적합하지 않습니다. 이와 같은 상황에서는 jQuery와 같은 더 가볍고 간단한 기술을 사용하는 것이 더 나을 수 있습니다.

간단한 AngularJS 예제

다음은 양식이 포함된 일반적인 CRUD 애플리케이션입니다. 양식 값의 유효성을 먼저 확인한 후 총 값을 계산하는 데 사용되며 이는 로컬 스타일로 형식화됩니다. 먼저 이해해야 할 개발자 간의 몇 가지 일반적인 개념은 다음과 같습니다.

1. 데이터 모델(data-model)을 뷰(UI)에 연결합니다. 2. 사용자 입력을 쓰고 읽고 확인합니다.

3. 모델에 따라 새로운 값을 계산합니다.
4. 출력 형식을 현지화합니다.

index.html:

코드 복사 코드는 다음과 같습니다.

   
       
       
   
   
       

            송장:
           

           

            <테이블>
                수량비용
               
                   
                   
               
           
            <시간>
            총계: {{수량 * 비용 | 통화}}