O Angular fornece algum suporte para um loop for usando números em suas diretivas HTML:
<div data-ng-repeat="i in [1,2,3,4,5]">
do something
</div>
Mas se sua variável de escopo incluir um intervalo que tenha um número dinâmico, será necessário criar uma matriz vazia a cada vez.
No controlador
var range = [];
for(var i=0;i<total;i++) {
range.push(i);
}
$scope.range = range;
No HTML
<div data-ng-repeat="i in range">
do something
</div>
Isso funciona, mas é desnecessário, pois não usaremos a matriz de alcance dentro do loop. Alguém sabe como definir um intervalo ou um valor regular para min / max?
Algo como:
<div data-ng-repeat="i in 1 .. 100">
do something
</div>
angularjs
angularjs-ng-repeat
Matsko
fonte
fonte
Respostas:
Ajustei um pouco essa resposta e criei esse violino .
Filtro definido como:
Com a repetição usada assim:
fonte
Eu vim com uma versão ainda mais simples, para criar um intervalo entre dois números definidos, por exemplo. 5 a 15
Veja a demonstração no JSFiddle
HTML :
Controlador :
fonte
var a; void 0 === a
"verdadeiramente" indefinido.Nada além de Javascript simples (você nem precisa de um controlador):
Muito útil ao fazer maquete
fonte
Referencing "constructor" field in Angular expressions is disallowed! Expression: [].constructor(10)
. Talvez isso estivesse funcionando em uma versão anterior do Angular ou estou fazendo algo errado.[].slice.constructor
, por exemplo , o que dá acesso eFunction
, portanto, a avaliação do código).Eu vim com uma sintaxe um pouco diferente, que me convém um pouco mais e adiciona um limite inferior opcional:
que você pode usar como
ou
fonte
$digest
iterações ao usar um valor de escopo, ou sejang-repeat="n in [1, maxValue] | makeRange"
:?Para quem é novo no angularjs. O índice pode ser obtido usando $ index.
Por exemplo:
O que, quando você estiver usando o prático filtro do Gloopy, imprimirá:
faça algo número 0
faça algo número 1
faça algo número 2
faça algo número 3
faça algo número 4
faça algo número 5
faça algo número 6
faça algo número 6 faça algo número 7
faça algo número 8
faça algo número 9
fonte
do something number {{n}}
também seria suficiente.Uma maneira curta de fazer isso seria usar o método _.range () de Underscore.js. :)
http://underscorejs.org/#range
fonte
Eu uso minha
ng-repeat-range
diretiva personalizada :e código html é
ou simplesmente
ou simplesmente
ou apenas
fonte
element.attr('ng-repeat', 'n in [' + rangeString + ']');
não funciona ...A solução mais simples sem código foi iniciar uma matriz com o intervalo e usar o $ index + da maneira que eu quiser compensar:
fonte
Definição de método
O código abaixo define um método
range()
disponível para todo o escopo do seu aplicativoMyApp
. Seu comportamento é muito semelhante aorange()
método Python .Uso
Com um parâmetro:
0, 1, 2,
Com dois parâmetros:
1, 2, 3, 4,
Com três parâmetros:
-2, -1.5, -1, -0.5, 0, 0.5,
fonte
Você pode usar os filtros 'after' ou 'before' no módulo angular.filter ( https://github.com/a8m/angular-filter )
HTML:
resultado: 5, 6, 7, 8, 9, 10
fonte
Sem nenhuma alteração no seu controlador, você pode usar isto:
Aproveitar!
fonte
Resposta mais curta: 2 linhas de código
JS (no seu controlador AngularJS)
HTML
... onde
myCount
está o número de estrelas que devem aparecer neste local.Você pode usar
$index
para qualquer operação de rastreamento. Por exemplo, se você quiser imprimir alguma mutação no índice, poderá colocar o seguinte nodiv
:fonte
Usando UnderscoreJS:
Aplicar isso para
$rootScope
disponibilizá-lo em qualquer lugar:fonte
Muito simples:
fonte
Oi, você pode conseguir isso usando html puro usando AngularJS (nenhuma diretiva é necessária!)
fonte
Definir escopo no controlador
Definir repetição no arquivo de modelo HTML
fonte
Uma melhoria na solução da @ Mormegil
uso
3 2 1 0 -1 -2 -3
-3 -2 -1 0 1 2 3
0 1 2 3
0 -1 -2 -3
fonte
Eu tentei o seguinte e funcionou muito bem para mim:
Angular 1.3.6
fonte
Tarde para a festa. Mas acabei fazendo isso:
No seu controlador:
Html:
fonte
Esta é a resposta aprimorada do jzm (não posso comentar mais, gostaria de comentar sua resposta porque ela incluiu erros). A função tem um valor de faixa inicial / final, portanto, é mais flexível e ... funciona. Este caso específico é para o dia do mês:
fonte
Eu agitei isso e vi que poderia ser útil para alguns. (Sim, CoffeeScript. Me processe.)
Directiva
Usar:
HTML
Isso pode ficar mais simples?
Eu sou cauteloso com os filtros, porque o Angular gosta de reavaliá-los sem uma boa razão o tempo todo, e é um gargalo enorme se você tiver milhares deles como eu.
Essa diretiva até observará as mudanças no seu modelo e atualizará o elemento de acordo.
fonte
Se você deseja conseguir isso em html sem nenhum controlador ou fábrica.
fonte
Suponha que
$scope.refernceurl
seja uma matrizfonte
Esta é a variante mais simples: basta usar a matriz de números inteiros ....
fonte