태그: Angular

Angular Observable & RxJS

ObservableObservable은 Application의 Publisher와 Subscriber 사이의 메시지 전달을 지원하는 기능을 제공합니다. Observable은 이벤트 처리, 비동기 프로그래밍 및 다중 값 처리와 관련된 다른 기술에 비해 상당한 이점을 제공합니다. Observable은 선언적입니다. 즉, 여러분이 값을 게시하는 함수를 정의해도,

Angular에서 ViewChildren, ContentChildren, 그리고 QueryList 이해하기

Angular에서 ViewChildren, ContentChildren, 그리고 QueryList 이해하기부모 Component에서 자녀에게 액세스 해야하는 경우가 있습니다. Angular로 어떻게 처리 할 수 있는지 보도록 하겠습니다. ViewChildren View DOM에서 지정된 Component 또는 Directive를 QueryList로 반환합니

Angular에서 동적 컨텐츠 생성

Angular에서 동적 컨텐츠 생성이 글에서 Angular로 동적 컨텐츠를 만드는 몇가지 방법을 보여 드리겠습니다. 사용자 지정 리스트 템플릿, 동적 Component 생성, 런타임 Component 및 모듈 컴파일의 예제를 보여줍니다. 전체 소스 코드는 이 글의 끝부분에서 보실수 있습니다. 제가 작업하고 있는 Developing with Angular에서

Angular에서 간단하게 번역기능 구현하기

Angular에서 간단하게 번역기능 구현하기이글은 Angular에서 번역을 구현하는 방법에 대해 설명합니다. 소개이 글에서 다음과 같은 방법을 배웁니다. 아래와 같이 HTML 뷰에서 단어를 번역하는데 사용할 수있는 Pipe를 만듭니다. 12<!-- should display 'hola mundo' when translate to Spanish --&

Angular 동적 컴포넌트 로딩

Dynamic Component LoaderComponent 템플릿이 항상 고정되어있는 것은 아닙니다. 응용 프로그램은 런타임에 새로운 Component를 로드할 수 있어야 합니다.이 포스트는 ComponentFactoryResolver를 사용하여 Component를 동적으로 추가하는 방법을 설명합니다. live example을 보거나 다운로드할 수 있습니

Angular HttpClient

HttpClient대부분의 프런트 엔드 응용 프로그램은 HTTP 프로토콜을 통해 백엔드 서비스와 통신합니다. 최신 브라우저는 HTTP 요청을하기 위해 XMLHttpRequest 인터페이스와 fetch() API의 두 가지 API를 지원합니다. @angular/common/http의 HttpClient를 사용하면 브라우저에서 공개되는 XMLHttpReques

Angular 튜터리얼 - HTTP

HTTP이 페이지에서 다음과 같이 개선할 것입니다. 서버에서 Hero 데이터를 가져옵니다. 사용자가 Hero 이름을 추가, 편집 및 삭제할 수 있습니다. 변경 사항을 서버에 저장합니다. 원격 서버의 웹 API에 해당 HTTP 호출을 하도록 앱을 수정합니다. 이 페이지를 끝내면 앱은이 라이브 예제/예제 다운로드처럼 보일 것입니다. 어디까지 했었나?이전 페

Angular 튜터리얼 - 서비스

ServicesTour of Heroes 앱이 발전함에 따라 Hero 데이터에 액세스 해야하는 더 많은 Component가 추가됩니다. 동일한 코드를 반복해서 복사후 붙여 넣는 대신 재사용 가능한 단일 데이터 Service를 만들어 필요한 Component에 삽입합니다. 별도의 Service를 사용하면 Component를 간결하게 유지하고 View 지원에

Angular 튜터리얼 - 다중 콤포넌트

Multiple Components현재 AppComponent에서 모든 것을 하고 있습니다. 처음에는 하나의 Hero에 대한 상세 보기를 보여주었습니다. 그런 다음 Hero들 목록과 Hero 세부 정보가 모두 포함된 master/detail 형식이 되었습니다. 곧 새로운 요구 사항과 기능이 생길 것입니다. 한 Component에 모든 기능을 유지할 수는 없

Angular 튜터리얼 - Hero 에디터

The Hero EditorLocal 개발환경 설치설치 안내에 따라 angle-tour-of-heroes라는 새 프로젝트를 만듭니다. 파일 구조는 다음과 같아야합니다. 123456789101112angular-tour-of-heroes ┣ src ┃ ┣ app ┃ ┃ ┣ app.component.ts ┃ ┃ ┗ app.module.ts ┃ ┣ m