AngularJS와 NG 반복 명령
예를 AngularJS와
루프 출력 여러 제목 :
<바디 NG-응용 프로그램 = "을 myApp "NG 컨트롤러 = "myCtrl">
<H1의 NG-반복 = "X 레코드"> {{X}} </ H1>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.records = [
은 "자습서 1"
"이 튜토리얼 2"
은 "자습서 3"
은 "튜토리얼 4"
]
});
</ 스크립트>
</ BODY>
<H1의 NG-반복 = "X 레코드"> {{X}} </ H1>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.records = [
은 "자습서 1"
"이 튜토리얼 2"
은 "자습서 3"
은 "튜토리얼 4"
]
});
</ 스크립트>
</ BODY>
»시도
정의 및 사용
HTML 엘리먼트들의 지정된 수NG 반복 명령 루프 출력.
컬렉션 배열이나 객체 여야합니다.
문법
<요소 NG-반복 = "표현 "> </ 요소>
모든 HTML 엘리먼트는 명령을 지원한다.
매개 변수 값
값 | 기술 |
---|---|
식 | 표현 방법 수집주기를 정의합니다. 예 규칙 식 : x in records (key, value) in myObj |
더 많은 예제
예를 AngularJS와
배열 루프를 사용하여 테이블을 출력한다 :
<표 NG 컨트롤러 = "myCtrl "국경 = "1">
<TR의 NG-반복 = "X 레코드">
<TD> {{x.Name}} </ TD>
<TD> {{x.Country}} </ TD>
</ TR>
</ 테이블>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.records = [
{
"이름": "이 Alfreds Futterkiste"
"국가": "독일"
}, {
"이름": "Berglunds snabbkop"
"국가": "스웨덴"
}, {
"이름": "센트로 COMERCIAL Moctezuma"
"국가": "멕시코"
}, {
"이름": "언 스트 헨델"
"국가": "오스트리아"
}
]
});
</ 스크립트>
<TR의 NG-반복 = "X 레코드">
<TD> {{x.Name}} </ TD>
<TD> {{x.Country}} </ TD>
</ TR>
</ 테이블>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.records = [
{
"이름": "이 Alfreds Futterkiste"
"국가": "독일"
}, {
"이름": "Berglunds snabbkop"
"국가": "스웨덴"
}, {
"이름": "센트로 COMERCIAL Moctezuma"
"국가": "멕시코"
}, {
"이름": "언 스트 헨델"
"국가": "오스트리아"
}
]
});
</ 스크립트>
»시도
예를 AngularJS와
대상물 테이블을 이용하여 출력의주기 :
<표 NG 컨트롤러 = "myCtrl "국경 = "1">
<TR 겨 반복 = "( myObj로의 X, Y)">
<TD> {{X}} </ TD>
<TD> {{Y}} </ TD>
</ TR>
</ 테이블>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.myObj = {
"이름": "이 Alfreds Futterkiste"
"국제": "독일"
"도시": "베를린"
}
});
</ 스크립트>
<TR 겨 반복 = "( myObj로의 X, Y)">
<TD> {{X}} </ TD>
<TD> {{Y}} </ TD>
</ TR>
</ 테이블>
<스크립트>
var에 응용 = angular.module ( "을 myApp", []);
app.controller ( "myCtrl", 기능 ($ 범위) {
$ Scope.myObj = {
"이름": "이 Alfreds Futterkiste"
"국제": "독일"
"도시": "베를린"
}
});
</ 스크립트>
»시도