AngularJS instrução ng-repeat
Manual de Referência AngularJS
AngularJS exemplos
saída de loop vários títulos:
<Body ng-app = "myApp " ng-controller = "myCtrl">
<H1 ng-repeat = "x nos registros"> {{x}} </ h1>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.records = [
O "Tutorial 1"
"Este tutorial 2"
O "Tutorial 3"
O "Tutorial 4"
]
});
</ Script>
</ Body>
<H1 ng-repeat = "x nos registros"> {{x}} </ h1>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.records = [
O "Tutorial 1"
"Este tutorial 2"
O "Tutorial 3"
O "Tutorial 4"
]
});
</ Script>
</ Body>
tente »
Definição e Uso
ng-repeat saída do loop de instruções por um determinado número de elementos HTML.
Coleção deve ser uma matriz ou objeto.
gramática
<Elemento ng-repeat = "expressão "> </ element>
Todos os elementos HTML apoiar a instrução.
parâmetro Valor
| valor | descrição |
|---|---|
| expressão | Expressão define como um ciclo de coleta. expressão da regra Exemplo: x in records (key, value) in myObj |
mais exemplos
AngularJS exemplos
Usando um loop de matriz gera uma tabela:
<Tabela ng-controller = "myCtrl " border = "1">
<Tr ng-repeat = "x nos registros">
<Td> {{x.Name}} </ td>
<Td> {{x.Country}} </ td>
</ Tr>
</ Table>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.records = [
{
"Nome": "Alfreds Futterkiste",
"País": "Alemanha"
}, {
"Nome": "Berglunds snabbkop",
"País": "Sweden"
}, {
"Nome": "Centro comercial Moctezuma",
"País": "México"
}, {
"Nome": "Ernst Handel",
"País": "Áustria"
}
]
});
</ Script>
<Tr ng-repeat = "x nos registros">
<Td> {{x.Name}} </ td>
<Td> {{x.Country}} </ td>
</ Tr>
</ Table>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.records = [
{
"Nome": "Alfreds Futterkiste",
"País": "Alemanha"
}, {
"Nome": "Berglunds snabbkop",
"País": "Sweden"
}, {
"Nome": "Centro comercial Moctezuma",
"País": "México"
}, {
"Nome": "Ernst Handel",
"País": "Áustria"
}
]
});
</ Script>
tente »
AngularJS exemplos
Um ciclo da saída usando a tabela do objeto:
<Tabela ng-controller = "myCtrl " border = "1">
<Tr ng-repeat = "( x, y) em myObj">
<Td> {{x}} </ td>
<Td> {{y}} </ td>
</ Tr>
</ Table>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.myObj = {
"Nome": "Alfreds Futterkiste",
"País": "Alemanha",
"City": "Berlin"
}
});
</ Script>
<Tr ng-repeat = "( x, y) em myObj">
<Td> {{x}} </ td>
<Td> {{y}} </ td>
</ Tr>
</ Table>
<Script>
var app = angular.module ( "myApp", []);
app.controller ( "myCtrl", function ($ escopo) {
$ Scope.myObj = {
"Nome": "Alfreds Futterkiste",
"País": "Alemanha",
"City": "Berlin"
}
});
</ Script>
tente »