(참고) XHR = XmlHttpRequest 의 약자입니다.... 무슨넘의 약자를 이리 많이 쓰노... 하드코딩 데이터 셋안의 세개의 폰들을 가지고 앱을 구성하는 것은 이젠 충분합니다. 자 이제 $http 를 가지고 서버로부터 좀 더 큰 데이터 셋을 가져오도록 합시다. Angular의 DI를 사용해서 PhoneListCtrl 컨트롤에서 서비스를 제공 할 것입니다.여기 서버로부터 로드 한 20개의 폰 목록이 있습니다. Data 여러분 프로젝트 안에 app/phones/phones.json 파일에는 JSON 포멧에 맞춰 저장된 좀 더 큰 폰 리스트를 포함하고 있는 데이터셋이 있습니다아래 샘플 파일을 보세요. Controller컨트롤러는 웹 서버에 있는 app/phones/phones.json 파일안에 데이..

이번 단계에서는, 여러분들은 phone 리스트상의 아이템 정렬을 여러분의 사용자 컨트롤상에 부여하는 기능을 추가하겠습니다. 다이나믹 한 정렬은 새로운 모델 프로퍼티를 만드는 것, repeater와 함께 감싸는 것, 그리고 작업의 나머지를 하는 데이터 바인딩 마술을 시키는 것에 의해 구현됩니다.-검색 박스 이외에, 어플리케이션은 phone이 목록화 된 것을 정렬하도록 사용자가 컨트롤 하는 것을 허가하는 dropdown 메뉴를 보여드립니다. 가장 중요한 변화는 아래 링크를 보고 참고하세요. https://github.com/angular/angular-phonecat/compare/step-3...step-4 Templateapp/index.html : index.html 템플릿에 아래 변경 사항들을 구현 ..

오늘 진행한 부분에 대해서도 크게 어려운 점은 없었지만, Filter의 효과를 어디에 접목시켜서 잘 쓸것인지 고민해야 겠다. 암튼 시작! 지난 시간에 어플리케이션을 위한 기반을 마련하는데 많은 일들을 했습니다. 그래서 지금부터는 간단한 무언가를 할 것 입니다; 전체 텍스트 검색을 추가할 것입니다. (예, 간단할 것입니다.) 또한 E2E (End-to-End 를 E2E라고 약자로 사용할겁니다.... 한글로 적당한 말이 생각이 안나요;;) 테스트를 작성할 것입니다. 왜냐하면 좋은 E2E 테스트는 좋은 친구이니까요. E2E는 여러분들의 어플리케이션에 머물러 있고, E2E에 집중하시고 빠르게 뒤돌아감을 발견하세요. -어플리케이션은 지금부터 검색박스를 갖습니다.페이지상에 Phone 목록은 사용자가 검색박스에 타이..

1. Static TemplateAngular가 표준 HTML을 어떻게 증진시키는지에 대해 설명하기 위해서는, 여러분들은 순수한 정적 HTML 페이지를 만들고, 이 HTML 코드를 Angular가 어떠한 데이터 셋을 가지고도 같은 결과를 다이나믹하게 보여주는 탬플릿으로 어떻게 변경할 수 있는지에 대해 설명할 것입니다. 이번 단계에서 여러분들은 두 개의 셀룰러 폰에 대한 약간의 기본 정보를 HTML 페이지에 추가할 것입니다.-페이지는 현재 두개의 폰에 관한 정보를 가진 리스트를 포함하고 있다.첫번째 단계 체크아웃 : Git checkout –f step-1app/index.html Experiments 정적인 HTML에 아래 예제 내용을 추가해보세요. Total number of phone : 2 Summ..

Bootstrapping * Bootstrap 이란? (네이버 백과사전 에서…)그 자체의 동작에 의해서 어떤 소정의 상태로 이행하도록 설정되어 있는 방법. 예를 들면, 최초의 수개의 명령에 의해서 그것에 계속해서 모든 명령을 입력 장치에서 계산기내에 패치 할 수 있도록 하는 방법. 즉 프로그램을 입력하는 방법의 하나이며, 최초에 명령을 읽어 들이기 위한 간단한 조작을 하면 계속해서 명령을 fetch하는 것을 순차로 하여 최종적으로 완전한 프로그램이 기억 장치 내에 수용 되도록 하는 방법을 말한다. 단, 루틴을 가리킬 때에는 부트스트랩 루틴 또는 부트스트랩 입력 루틴 등으로 부르며, 입력동작을 부트스트랩이라고 하는 경우가 많다. 또 그것 자체가 주기억장치에 로드 한다는 의미 이며, 셀프 로딩 혹은 셀프 로..

자... 이제부터 AngularJS에 대한 공략을 시작해봅시다. 이번주는 PhoneCat Tutorial App에 대한 번역을 시작하겠습니다. 어설픈 번역이겠지만, 공부한다는 의미로 진행하는 것이니.. 잘 부탁드립니다. 시작!! PhoneCat Tutorial App AngularJS를 설명하는 가장 좋은 방법은 AngularJS로 기 제작한 웹 응용프로그램의 구성을 가지고 튜토리얼을 진행하는 것입니다. 앞으로 여러분들이 만들 이 앱은 안드로이드 폰 목록을 볼 수 있는 카달로그 이며, 관심이 있는 장비만 필터링 해서 세부사항까지 볼 수 있는 기능을 가지고 있습니다. 네이브티 확장 혹은 플러그인의 추가 설치 없이 Angular를 브라우저를 보다 스마트하게 만들 수 있는 방법을 볼 수 있는 튜토리얼을 따라 ..