추적

차이

문서의 선택한 두 판 사이의 차이를 보여줍니다.

차이 보기로 링크

다음 판		이전 판
tech:angularjs [2016/09/20 15:35] – 만듦 V_Ltech:angularjs [2016/10/18 03:28] (현재) – [참조] V_L
줄 2: 줄 2:
 ====== Angularjs ====== ====== Angularjs ======
 {{INLINETOC}} {{INLINETOC}}
 +  <script type="text/javascript" src="https://code.angularjs.org/1.5.8/angular.min.js"></script>
 +=====문법=====
 +====지시어(Directives)====
  
- +===ng-app=== 
 +앱 모듈을 페이지에 붙임 
 + 
 +  <html ng-app="store"> 
 +===ng-controller=== 
 +컨트롤 기능을 페이지에 붙임 
 +  <body ng-controller="StoreController as store"> 
 + 
 +===ng-show/ng-hide=== 
 +표현문에 따라 특정 구역을 표시/숨김 
 +  <h1 ng-show="name"> hello, {{name}} </h1> 
 +===ng-repeat=== 
 +특정 구역을 배열의 각 항목 만큼 반복함 
 +  <li ng-repeat="product in store.products"> {{product.name}} </li> 
 + 
 + 
 +===ng-init=== 
 +===ng-click=== 
 +===ng-class=== 
 + 
 +  <li ng-class="{active:tab ===3}"> 
 +===ng-model=== 
 + 
 +폼의 요소 값과 컨트롤의 항목을 연동시킨다. 
 +    <select ng-model="review.stars" class="form-control" ng-options="stars for stars in [5,4,3,2,1]"  title="Stars"> 
 +====필터(Filters)==== 
 + 
 +  <em class="pull-right">{{product.price | currency}}</em> 
 +   <img ng-src="{{product.images[0]}}" /> 
 +=====참조=====
   * http://programmingsummaries.tistory.com/category/AngularJS   * http://programmingsummaries.tistory.com/category/AngularJS
   * http://blog.outsider.ne.kr/search/angular?page=4   * http://blog.outsider.ne.kr/search/angular?page=4
줄 14: 줄 46:
   * https://egghead.io/technologies/angularjs   * https://egghead.io/technologies/angularjs
   * http://campus.codeschool.com/courses/shaping-up-with-angular-js/contents   * http://campus.codeschool.com/courses/shaping-up-with-angular-js/contents
 +
 +
 +  * https://github.com/Pentiado/angular-lazy-img
 +
 +http://soomong.net/blog/2014/01/20/translation-ultimate-guide-to-learning-angularjs-in-one-day/
 +
 +
 +예제
 +
 +  *[[http://stackoverflow.com/questions/26921198/angular-call-modal-in-different-file|파일 팝업]]
 +
 +