AngularJS Directives(지시문) - Repeating HTML Elements(반복되는 HTML 요소)
AngularJS Directives(지시문) - Repeating HTML Elements(반복되는 HTML 요소)
이 ng-repeat지시문은 HTML 요소를 반복합니다.
<div ng-app="" ng-init="names=['Jani','Hege','Kai']">
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div>
소스
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="" ng-init="names=['Jani','Hege','Kai']">
<p>Looping with ng-repeat:</p>
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div>
</body>
</html>
ng-repeat지시어는 실제로 HTML 요소를 복제합니다 콜렉션의 각 항목에 대해 한 번.
ng-repeat오브젝트의 배열에 사용 지시문 :
예
<div ng-app="" ng-init="names=[
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]">
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
소스
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="" ng-init="names=[
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]">
<p>Looping with objects:</p>
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}</li>
</ul>
</div>
</body>
</html>
이 ng-repeat지시문은 HTML 요소를 반복합니다.
<div ng-app="" ng-init="names=['Jani','Hege','Kai']">
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div>
소스
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="" ng-init="names=['Jani','Hege','Kai']">
<p>Looping with ng-repeat:</p>
<ul>
<li ng-repeat="x in names">
{{ x }}
</li>
</ul>
</div>
</body>
</html>
ng-repeat지시어는 실제로 HTML 요소를 복제합니다 콜렉션의 각 항목에 대해 한 번.
ng-repeat오브젝트의 배열에 사용 지시문 :
예
<div ng-app="" ng-init="names=[
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]">
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}
</li>
</ul>
</div>
소스
<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>
<div ng-app="" ng-init="names=[
{name:'Jani',country:'Norway'},
{name:'Hege',country:'Sweden'},
{name:'Kai',country:'Denmark'}]">
<p>Looping with objects:</p>
<ul>
<li ng-repeat="x in names">
{{ x.name + ', ' + x.country }}</li>
</ul>
</div>
</body>
</html>
게시판 목록
퍼블리싱강좌
| 번호 | 분류 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|---|
| 298 | CSS |
선택과집중
|
2개월 전 | 152 | |
| 297 | CSS |
선택과집중
|
3개월 전 | 355 | |
| 296 | CSS |
선택과집중
|
3개월 전 | 307 | |
| 295 | CSS |
선택과집중
|
3개월 전 | 286 | |
| 294 | CSS |
선택과집중
|
4개월 전 | 410 | |
| 293 | CSS |
선택과집중
|
4개월 전 | 359 | |
| 292 | CSS |
선택과집중
|
4개월 전 | 278 | |
| 291 | CSS |
선택과집중
|
4개월 전 | 286 | |
| 290 | CSS |
선택과집중
|
4개월 전 | 331 | |
| 289 | CSS |
선택과집중
|
4개월 전 | 305 | |
| 288 | CSS |
선택과집중
|
5개월 전 | 388 | |
| 287 | CSS |
선택과집중
|
5개월 전 | 339 | |
| 286 | CSS |
선택과집중
|
5개월 전 | 338 | |
| 285 | CSS |
선택과집중
|
5개월 전 | 360 | |
| 284 | CSS |
선택과집중
|
5개월 전 | 244 | |
| 283 | CSS |
|
2년 전 | 1517 | |
| 282 | CSS | 2년 전 | 2494 | ||
| 281 | CSS | 4년 전 | 4025 | ||
| 280 | CSS | 4년 전 | 4548 | ||
| 279 | 반응형웹 | 5년 전 | 2979 | ||
| 278 | 반응형웹 | 5년 전 | 2827 | ||
| 277 | 부트스트랩 | 7년 전 | 5024 | ||
| 276 | 부트스트랩 | 7년 전 | 6579 | ||
| 275 | 부트스트랩 | 7년 전 | 4661 | ||
| 274 | 부트스트랩 | 7년 전 | 6692 | ||
| 273 | 부트스트랩 | 7년 전 | 3359 | ||
| 272 | 부트스트랩 | 7년 전 | 3198 | ||
| 271 | 부트스트랩 | 7년 전 | 3701 | ||
| 270 | 부트스트랩 | 7년 전 | 3220 | ||
| 269 | 부트스트랩 | 7년 전 | 3097 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기