Angular.js: ngRepeat com DL / DD / DT

segundo isso. Estou tendo esse problema há algum tempo.

@IgorMinar fez algum trabalho em um ng-repeat com base em comentários (https://github.com/angular/angular.js/pull/1646), mas como os comentários não funcionam tão bem em todos os navegadores, é improvável que seja fundido. Em vez disso, eles estão procurando uma solução alternativa, provavelmente com "tags de início e fim de repetição" ou "início de repetição e número de elementos para repetir rótulo"

Que tal permitir modelos dentro de pares como {{}}

pode ser:
{{! ng-repeat = "foo em l"

Em uma nota relacionada, eu tenho um problema semelhante com Haveria grandes desafios técnicos para um segundo formulário de interpolação
como {{{}}} que não escapou de caracteres html, mas também não criou um
novo período?

Na terça-feira, 29 de janeiro de 2013 às 12h38, Pete Bacon Darwin <
notificaçõ[email protected]> escreveu:

@IgorMinar https://github.com/IgorMinar trabalhou em um
ng-repeat com base em comentários (# 1646https: //github.com/angular/angular.js/issues/1646)
mas como os comentários não funcionam tão bem em todos os navegadores, é improvável que
ser mesclado. Em vez disso, eles estão procurando uma solução alternativa, provavelmente
com "tags de início e fim de repetição" ou "início-repetição e número de
elementos para repetir rótulo "

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -12856484.

Acabei de encontrar esse problema com uma tabela que deseja gerar dois elementos 'td' por objeto em uma matriz.

1 para adicionar este recurso. Acabei de encontrar essa mesma limitação.

:afirmativo:

Mesmo problema aqui. Adoraria ver algo como "ng-repeat-children" repetindo apenas os filhos, mas não o elemento atual ou um tipo de "ng-omit-tag" (que remove a tag atual, mas deixa os filhos no lugar) para ser usado junto com ng-repeat. Isso evitaria toneladas de marcação inválida gerada para contornar esse problema.

Não entendo totalmente a limitação que está em discussão. Por que colocar ng-repeat no elemento pai funciona? http://jsfiddle.net/JyWdT/13/
Alguém pode criar um violino que explique o problema com mais detalhes?

lgalfaso, Your fiddle cria várias listas de definições, cada uma com uma definição. A saída desejada é uma lista de definições com várias definições.

Ou, no meu caso, preciso criar um par de elementos "td" para cada item em uma matriz.
Digamos que eu tenha uma matriz,

[{name:dan, age:15}, {name:steve, age:21}]

e eu preciso produzir:

<tr><td>dan</td><td>15</td><td>steve</td><td>21</td></tr>

Não há como fazer isso com o angular neste momento.

você não pode fazer isso colocando ng-repeat no elemento tr?

http://plnkr.co/edit/lJvkOpz0NnKWcfEeM4lE?p=preview

No domingo, 21 de abril de 2013 às 14h24, zilles [email protected] escreveu:

lgalfaso, seu violino cria várias listas de definição, cada uma com uma
definição. A saída desejada é uma lista de definições com vários
definições.

Ou, no meu caso, preciso criar um par de elementos "td" para cada item em
uma matriz.
Digamos que eu tenha uma matriz,

[{ nome: dan , idade: 15 }, { nome: Steve , idade: 21 }]

e eu preciso produzir:

dan15Steve21

Não há como fazer isso com o angular neste momento.

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -16716788
.

Oh, entendo, desconsidere meu comentário anterior
Em 21 de abril de 2013, às 9h09, "jason turim" jason. [email protected] escreveu:

você não pode fazer isso colocando ng-repeat no elemento tr?

http://plnkr.co/edit/lJvkOpz0NnKWcfEeM4lE?p=preview

No domingo, 21 de abril de 2013 às 14h24, zilles [email protected] escreveu:

lgalfaso, seu violino cria várias listas de definição, cada uma com uma
definição. A saída desejada é uma lista de definições com vários
definições.

Ou, no meu caso, preciso criar um par de elementos "td" para cada item em
uma matriz.
Digamos que eu tenha uma matriz,

[{ nome: dan , idade: 15 }, { nome: Steve , idade: 21 }]

e eu preciso produzir:

dan15Steve21

Não há como fazer isso com o angular neste momento.

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -16716788
.

Como acabei de encontrar o problema dl / dt + dd, confirmo que um novo ng-repeat-children (ou ng-repeat-inner) é uma diretiva obrigatória ausente.

+1

Proposta de uma nova diretiva ng-repeat-inner. Se esta proposta estiver ok, então irá modificar todos os guias

Acho que seria melhor usar a mesma diretiva ng-repeat , mas permitir que essa diretiva seja usada em comentários HTML, como o post original sugere.

Algo assim deve funcionar:

<dl>
  <!-- ng-repeat="(name, definition) in myList" -->
  <dt>{{name}}</dt>
  <dd>{{definition}}</dd>
  <!-- /ng-repeat -->
</dl>

Não tenho certeza de como o início e o fim do bloco a ser repetido seriam alcançados ( <!-- /ng-repeat --> foi sugerido por @ProLoser), mas acho que usar comentários HTML seria uma solução elegante.

Dado que os minificadores podem eliminar os comentários e outros problemas com os comentários, eu
não acho que isso é ótimo. No entanto, gosto da ideia de usar ng-repeat.
seria viável incluir um atributo ng-repeat-single-root ou
algo que quando definido como verdadeiro executará o ng-repeat sem o root
elemento? Por exemplo:

{eu}

{eu}

se tornaria:

1

1

2

2

3

3

Na terça - feira, 23 de abril de 2013 às 15:54, Mani Tadayon

Acho que seria melhor usar a mesma diretiva ng-repeat, mas permitir
para que essa diretiva seja usada em comentários HTML, como a postagem original
sugere.

Algo assim deve funcionar:

{{nome}}

{{definição}}

Não sei exatamente como o início e o fim do bloco devem ser repetidos
seria alcançado (eu criei ono meu exemplo),
mas acho que usar comentários HTML seria uma solução elegante.

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -16891970
.

maxcan, posso ver as vantagens de "raiz única", já que você mantém o html de origem válido, mas essa construção não permite que você adicione mais nada dentro da tag "dl" ... Uma definição fixa, por exemplo, que você deseja para incluir antes de seu loop de definições dinâmicas. A solução de lgalfaso resolveria isso.

@maxcan sem um grande retrabalho ou uma

Gosto da sugestão de @bowsersenior , mas prefiro este como comentário de encerramento: <!-- /ng-repeat -->

Isso é uma pena para o impacto no desempenho. De qualquer forma, eu endosso fortemente
solução de @lgalfaso , assumindo que você pode colocar a diretiva em uma div e não
apenas um comentário ..

Na quarta-feira, 24 de abril de 2013 às 13h58, Dean Sofer [email protected] :

Eu gosto da sugestão de @bowsersenior https://github.com/bowsersenior , mas
Prefiro este como comentário final:

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -16964155
.

Concordo com @ProLoser que <!-- /ng-repeat --> é uma tag de fechamento melhor na abordagem de comentário HTML. Uma observação: angular permite que diretivas sejam definidas em comentários HTML, então não acho que os comentários HTML possam ser descartados como uma solução potencial para esse problema. Lembre-se de que os principais desenvolvedores do Angular indicaram que planejavam usar comentários HTML para resolver esse problema nesta questão de estouro de pilha (conforme apontado pelo autor original):

• http://stackoverflow.com/a/10458127/457819

Não me importo em descartá-los, desde que haja uma maneira de fazer isso sem
comentários.

Na quarta-feira, 24 de abril de 2013 às 14h41, Mani Tadayon [email protected] :

Concordo com @ProLoser https://github.com/ProLoser que é a melhor marca de fechamento na abordagem de comentário HTML. 1
note, angular permite que diretivas sejam definidas em comentários HTML, então eu não
acho que os comentários HTML podem ser descartados como uma solução potencial para este
problema. Lembre-se de que os principais desenvolvedores do angular indicaram que
planejou usar comentários HTML para resolver este problema neste estouro de pilha
pergunta (conforme apontado pelo autor original):

• http://stackoverflow.com/a/10458127/457819

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -16969268
.

+1 para ng-repeat-inner de @lgalfaso . Eu finalmente gostaria de algo que simplesmente fizesse isso.

Knockout faz isso com comentários. Estou tentando portar algo que fiz com a tag dl no knockout e parece que não é possível até que esse problema seja resolvido.

Esta é minha opinião, então sem a entrada de @mhevery ou @IgorMinar , leve isso com
Eu vejo que fazer o ng-repeat funcionar com comentários é mais flexível, de qualquer forma. Não parece natural sem uma mudança em $ compiler para que ele possa lidar com uma diretiva do tipo "entre comentários". A razão é que parece estranho que uma diretiva precise tomar cuidado com o aninhamento e olhar para fora do elemento que é fornecido para fazer o que deve

Se comentários / não comentários são a razão de uma controvérsia contínua, não podemos apenas ter os dois? Acho difícil entender que um problema tão comum não tenha sido resolvido por mais de 3 meses. Se a razão por trás disso é principalmente devido a uma controvérsia na implementação, parece mais preferível ter algo realmente implementado (e talvez atualizado / adicionado no futuro) do que esperar mais tempo sem nada por algo mais "ideal".

Na maioria dos casos, porém, parece-me que se ng-repeat-inner se refere à repetição de um conjunto de elementos "dentro" de um certo algo, isso implica que, na maioria dos casos, você já criou um contêiner externo exclusivo de algum tipo. Portanto, embora uma implementação de comentário possa ser mais versátil (embora talvez uma meia linha extra de código que eu gostaria de evitar se possível), eu sinto que ela pode ser menos usada (e talvez deva ser menos priorizada) do que uma diretiva in-element.

A questão de usar ou não comentários HTML não tem qualquer relação com o fato de que esse problema está pendente há alguns meses. Acho que tudo o que é necessário é alguma atenção dos mantenedores do angular para decidir o problema e implementar uma solução.

Caso você tenha perdido, veja aqui https://github.com/angular/angular.js/pull/1646 sobre problemas com repetidores baseados em comentários. A solução

Obrigado por apontar # 1646. Há um comentário nessa discussão de @mhevery que propõe "uma maneira melhor de fazer isso" sem mostrar nenhum código (provavelmente um erro de formatação):

Eu gostaria que soubéssemos o que era essa "maneira melhor"!

O consenso da equipe principal é que, atualmente, a melhor maneira de abordar esse problema é uma das seguintes (não decidimos sobre a sintaxe, mas a implementação é quase a mesma para todos eles):

todos esses exemplos contêm duas tags td , fiz isso de propósito, embora seja ilegal porque queria mostrar que o repetidor deve permitir a repetição em um número arbitrário de elementos - seria melhor converter esses exemplos para usar a tabela e as linhas da tabela, mas estou prestes a ficar offline agora e não tenho tempo para refatorá-las.

Sintaxe A:

<dl>
  <dt ng-repeat="(name, definition) in myList">{{name}}</dt>
  <dd ng-repeat-next>{{definition}}</dd>
  <dd ng-repeat-next>{{definition}}</dd>
</dl>

Sintaxe B:

<dl>
  <dt ng-repeat-start="(name, definition) in myList">{{name}}</dt>
  <dd>{{definition}}</dd>
  <dd ng-repeat-end>{{definition}}</dd>
</dl>

Sintaxe C:

<dl>
  <dt ng-repeat="(name, definition) in myList" ng-repeat-start>{{name}}</dt>
  <dd>{{definition}}</dd>
  <dd ng-repeat-end>{{definition}}</dd>
</dl>

Sintaxe D:

<dl>
  <dt ng-repeat="(name, definition) in myList" ng-repeat-group>{{name}}</dt>
  <dd ng-repeat-group>{{definition}}</dd>
  <dd ng-repeat-group>{{definition}}</dd>
</dl>

A longo prazo, assim que tivermos um suporte melhor ao navegador, começaremos a usar o novo elemento <template> , que nos permitirá fazer simplesmente isso:

Sintaxe X:

<template>
  <dl>
    <ng repeat="(name, definition) in myList">
      <dt>{{name}}</dt>
      <dd>{{definition}}</dd>
      <dd>{{definition}}</dd>
    </ng>
  </dl>
</template>

se alguém quiser criar um PR para essa solução, ele será mesclado. Além disso, se você tiver preferência por uma sintaxe específica, fale.

Obrigado pela contribuição. Do meu ponto de vista, a sintaxe A não é clara para loops aninhados como o seguinte

<dl>
  <dt ng-repeat="...">loop 1</dt>
  <dt ng-repeat="..." ng-repeat-next>loop 2</dt>
  <dd ng-repeat-next>is this within loop 2 or only loop 1</dd>
</dl>

As sintaxes B e C são quase iguais, gosto das duas alternativas (mesmo quando acho que a sintaxe B é de alguma forma melhor)

A menos que eu esteja perdendo algo, a sintaxe D tem os mesmos problemas de loops aninhados que a sintaxe A

Eu escolheria B se possível, puramente por ter que escrever a menor quantidade de letras. Também parece mais simétrico - acho que seria mais fácil de gerenciar devido à simetria visual.

O comentário de Igalfasos aponta um dilema interessante. E se o loop aninhado em seu exemplo estiver no primeiro elemento em vez do segundo. Então, todas as versões da sintaxe agora não estão claras, a menos que esteja faltando alguma coisa.

Não entendo muito bem a diferença entre o ng-repeat-inner proposto por @lgalfaso e o ng repeat na Sintaxe X, embora seja o pacote <template> . Alguém poderia explicar?

Também não tenho certeza se entendi, mas estou supondo que a tag <ng> não se torna parte do DOM, evitando assim uma estrutura de aninhamento ilegal em dl .

Quanto às sintaxes propostas, eu votaria em B.

Eu acredito que o caso da sintaxe X permite um elemento de invólucro fictício genérico <ng> que não faz parte do DOM e pode hospedar várias diretivas. Isso é mais genérico do que ng-repeat-inner , que se aplica apenas a um caso de uso específico para ng-repeat .

Se a sintaxe X, o objetivo de longo prazo, é apenas uma versão mais genérica de ng-repeat-inner , acho que ng-repeat-inner também deve ser (* não exclusivamente) adotado junto com um dos A, B propostos, C, D para o seguinte:

1. ambas as sintaxes X e ng-repeat-inner têm a mesma estrutura dom
   : se a sintaxe X é o objetivo de longo prazo, seria bom ter algo agora que se alinhe em termos de estrutura para evitar refatoração futura.
2. na maioria dos casos ng-repeat-inner seria suficiente de qualquer maneira
   : a intenção é criar um contêiner externo para repetir os elementos internos.

@ daegon123 a diferença entre qualquer uma das sintaxes listadas de @IgorMinar (incluindo X) e ng-repeat-inner é que as sintaxes permitem que você repita arbitrariamente um conjunto de elementos sem um contêiner distinto. Por exemplo, repita um conjunto de <tr> s enquanto houver outros <tr> s não repetidos em table ou tbody . Nesse caso, os elementos a serem repetidos não têm um pai distinto ao qual vincular ng-repeat-inner .

<table>
    <thead>...</thead>
    <tr ng-repeat-start="(name, definition) in myList">...</tr>
    <tr>...</tr>
    <tr ng-repeat-end>...</tr>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

Ou múltiplas definições por objeto em um <dl>

<dl>
    <dt ng-repeat-start="...">{{item.term1}}</dt>
    <dd>{{item.def1}}</dd>
    <dt>{{item.term2}}</dt>
    <dd>{{item.def2}}</dd>
    <dt>{{item.term3}}</dt>
    <dd ng-repeat-end>{{item.def3}}</dd>
</dl>

@ es128 Obrigado pelos comentários e código. Essa é exatamente a razão pela qual propus que ng-repeat-inner fosse aceito 'junto' com uma das outras sintaxes listadas, mas ver o código real em seus comentários começou a me fazer pensar se ng-repeat-inner é mesmo necessário. Vou postar outro comentário se encontrar algo - obrigado novamente!

O problema com ng-repeat-inner é que não pode ser usado em todos os casos, por exemplo:

<ul>
  <li>some static prefix item</li>
  <!-- repeat these nodes -->
    <li>{{ something }}</li>
    <li>{{ something else }}</li>
  <!-- repeat end -->
  <li>some static postfix item</li>
</ul>

porque você não pode colocar um elemento artificial (como div) em ul (por especificação html), ng-repeat-inner não pode ser usado aqui.

btw com o elemento template, seremos capazes de colocar um elemento artificial entre ul e li.

Além disso, não se apegue muito à sintaxe X, foi apenas um exemplo rápido e sujo do que eventualmente seremos capazes de fazer, a sintaxe exata ainda está para ser discutida, mas enquanto estou nisso, aqui está outra 1:

Sintaxe Y:

<ul>
  <li>some static prefix item</li>
  <template repeat="item in items">
    <li>{{ item.name }}</li>
    <li>{{ item.owner }}</li>
  </template>
  <li>some static postfix item</li>
</ul>

Que tal definir um id para o grupo ng-repeat?
Então, poderíamos anexar itens livremente a ele de qualquer nível. Algo como

<dl>
    <dt ng-repeat="item in items" ng-repeat-group="someId">{{item.term}}</dt>
    <dd ng-repeat-with="someId">{{item.definition}}</dd>
</dl>

poderia permitir a flexibilidade de que precisamos.

A implementação proposta da sintaxe C, acho que essa é a sintaxe que permitiria que esse mesmo mecanismo fosse fácil para outros elementos e diretivas

Bom trabalho Lucas! Passei a noite tentando implementar a sintaxe C. Funciona bem, mas não há suporte para aninhamento devido à transclusão transformando todos os ng-repeat s em comentários.

Se eu não conseguir atravessar o DOM procurando ng-repeat-start , não poderei calcular a profundidade do atributo ng-repeat-end para correspondência. Sua abordagem parece resolver o problema ...

Hmmm ... algo parece estar errado. Docs estão faltando em seu commit, então posso ser que não estou usando a sintaxe certa.

Dê uma olhada nisso:
http://plnkr.co/edit/sVilxKaNrhNM4JrkuQ5r?p=preview

Eu esperava que a saída para o caso não aninhado fosse:

Term: elastic
     Static term
     This definition should be repeated for every term: 'elastic' term
Term: par
     Static term
     This definition should be repeated for every term: 'par' term

E para o aninhado:

Term: elastic
     Static term
Subterm: superelastic
     Static subterm
     This should be repeater for every subterm: 'super' subterm from 'elastic' term
Subterm: subelastic
     Static subterm
     This should be repeater for every subterm: 'sub' subterm from 'elastic' term
     This definition should be repeated for every term: 'elastic' term
Term: par
     Static term
Subterm: superpar
     Static subterm
     This should be repeater for every subterm: 'super' subterm from 'par' term
Subterm: subpar
     Static subterm
     This should be repeater for every subterm: 'sub' subterm from 'par' term
     This definition should be repeated for every term: 'par' term

Estou faltando alguma coisa?

@lrlopez O exemplo que você colocou não está usando a versão mais recente do código. Além disso, há um </dl> extra na linha 23

Obrigado pela resposta rápida! Você está certo, havia um </dl> extra na linha 23. Eu também atualizei a biblioteca. No entanto, ainda não consigo trabalhar o exemplo aninhado ...

Ok, parece que esse é um problema real com as diretivas de vários elementos que estão no mesmo nível no DOM. Atualizado o PR com uma correção para este problema

Correções como ng-repeat-inner ou ng-repeat-next só resolvem uma das inúmeras situações em que os comportamentos de vinculação a nós DOM reais o limitarão.

Em vez de corrigir cada diretiva individualmente, você pode resolver isso para toda a estrutura adicionando suporte para nós virtuais que não são renderizados na árvore real.

A ideia de usar comentários é semelhante, mas resulta em código feio e difícil de ler e você ainda precisa encontrar uma maneira de nomear esse nó e fechá-lo de alguma forma. Em vez de inventar uma nova sintaxe de nó de comentário, use a sintaxe HTML existente.

Pense nisso como um conceito semelhante a, digamos, aulas silenciosas SASS:

<div id="myComplexList">
    <ng-virtual ng-repeat="...">
        <a></a>
        <b></b>
        <c></c>
    </ng-virtual>
</div>

Result:

<div id="myComplexList">
    <a></a>
    <b></b>
    <c></c>
    <a></a>
    <b></b>
    <c></c>
    <a></a>
    <b></b>
    <c></c>
    ...
</div>

+1 para a ideia geral, mas eu escolheria algo como ng-repeat-group.

<ng-repeat-group="b in ches">
// group markup to be repeated here
</ng-repeat-group>

Gosto da ideia de nós virtuais, mas sou contra ela se tornar uma solução geral para o problema aqui.

Se possível, gostaria de limitar a criação de quaisquer recipientes artificiais. Embora o contêiner possa não aparecer no html do resultado geral, ele começaria a bagunçar o código html que precisa ser gerenciado.

Em muitos casos, precisaremos de algum contêiner para conter o que queremos repetir. ex:

<tr>
  <td ng-repeat-start>1</td>
  <td ng-repeat-end>2</td>
</tr>

(o contêiner aqui é o [tr] s)

usar a solução de nó virtual proposta transformaria isso em:

<tr>
  <ng-virtual ng-repeat="...">
     <td>1</td>
     <td>2</td>
  </ng-virtual>
</tr>

criando um contêiner redundante: mesmo essa adição de duas linhas me deixa desconfortável pensando como seria se o código ficasse mais longo.

Outro problema é que vai começar a se tornar tedioso tentar entender em que nível de dom o código está atualmente.
Aqui está um pouco de código de @ es128

<table>
<thead>...</thead>
    <tr ng-repeat-start="(name, definition) in myList">...</tr>
    <tr>...</tr>
    <tr ng-repeat-end>...</tr>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

o uso de nós virtuais transforma isso em:

<table>
<thead>...</thead>
    <ng-virtual ng-repeat="...">
        <tr">...</tr>
        <tr>...</tr>
        <tr>...</tr>
    </ng-virtual>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

A repetição dos primeiros 3 trs e do tr final estão no mesmo nível, mas se eu fosse apenas dar uma olhada rápida no código, há uma chance de confundi-los com níveis diferentes ou vou começar a me encontrar calcular tediosamente (talvez incorretamente) em que nível o código está trabalhando, especialmente se essas coisas começarem a se aninhar.

Aqui está uma versão específica de sintaxe de que gosto (do tipo B):

<ul>
  <li>some static prefix item</li>
  <li ng-repeat-block="(name, definition) in myList">{{ something }}</li>
  <li>{{ something else }}</li>
  <li ng-repeat-block-close>{{ something else }}</li>
  <li>some static postfix item</li>
</ul>

@stanvass, sua proposta é uma variação do que @IgorMinar postou como sintaxe X, o principal problema é que o suporte ao navegador simplesmente não existe

Acabei de perceber que ter um ng-repeat-start e um ng-repeat-end é redundante no caso de você querer repetir apenas um elemento interno.

<tr>
  <td ng-repeat-start ng-repeat-end>repeat this</td>
</tr>

Seria bom se também pudéssemos ter um ng-repeat-single que evitasse isso. ex.

<tr>
  <td ng-repeat-single>repeat this</td>
</tr>

@ daegon123 se você quiser repetir um único elemento, basta fazer

<tr>
  <td ng-repeat="...">repeat this</td>
</tr>

Não há necessidade de ng-repeat-start nem ng- repeat-end

@lgalfaso Obrigado, parece que me

Acho que essa questão não é simplesmente repetir um elemento. É mais sobre como repetir um conjunto de elementos sem repetir seu pai. ou seja, <dt>..<dd>... - mas havia muitos outros bons exemplos aqui.

A sintaxe X é a única bem definida quando você inicia as repetições de aninhamento. Como você escreveria o seguinte na sintaxe AD:

<template>
  <dl>
    <ng repeat="book in myList">
      <dt ng-repeat="author in book.authors">{{author.name}}</dt>
      <dd>{{book.title}}</dd>
      <dd>{{book.description}}</dd>
    </ng>
  </dl>
</template>

É uma sugestão melhor.
Enviado do My Blackberry®

-----Mensagem original-----
De: daegon123 [email protected]
Data: Seg, 06 de maio de 2013 22:57:16
Para: angular / angular.jsangular. [email protected]
Responder a: "angular / angular.js" [email protected]
Assunto: Re: [angular.js] ngRepeat com DL / DD / DT (# 1891)

Acabei de perceber que ter um ng-repeat-start e um ng-repeat-end é redundante no caso de você querer repetir apenas um elemento interno.

<tr>
  <td ng-repeat-start ng-repeat-end>repeat this</td>
</tr>

Seria bom se também pudéssemos ter um ng-repeat-single que evitasse isso. ex.

<tr>
  <td ng-repeat-single>repeat this</td>
</tr>

Responda a este e-mail diretamente ou visualize-o no GitHub:
https://github.com/angular/angular.js/issues/1891#issuecomment -17524685

+1, esta é uma grande limitação.

: +1: estamos ansiosos para ver uma solução para isso! Vou usar <li> por enquanto, mas adoraria refatorar essa marcação quando o angular vier com uma solução para isso =)

O nº 2783 resolveria isso?

sim. Temos uma solução que acabou de chegar: e46100f7097d9a8f174bdb9e15d4c6098395c3f2

Estou encerrando este problema.

Recebi o erro: <TypeError: Object #<Text> has no method 'hasAttribute'> neste exemplo simples:

<table>
        <tr ng-repeat-start="value in [1,2,3,4]">I get repeated</tr>
        <tr ng-repeat-end>I also get repeated</tr>
    </table>

Também obtendo o problema como afirma gevgeny.
não tem método 'hasAttribute'>

<tr>
                <td data-ng-repeat-start="column in selectedItem.Beds" class="text-center">Avail. Beds</td>
                <td data-ng-repeat-end>Extra Bed Spaces</td>
</tr>

@ kharnt0x veja esta solicitação de puul https://github.com/angular/angular.js/pull/2859

Como o nº 2783 resolveria isso:

{[{h: "1",
   o: [{h: "1.1",
        o: [{h: "1.1.1"},
            {h: "1.1.2"},
            {h: "1.1.3"}]},
       {h: "1.2",
        o: [{h: "1.2.1"},
            {h: "1.2.2"},
            {h: "1.2.3"}]},

....

Ele precisa gerar algo assim:

<h1>1</h1>
<h2>1.1</h2>
<h3>1.1.1</h3>
<h3>1.1.2</h3>
<h3>1.1.3</h3>
<h2>1.2</h2>
<h3>1.2.1</h3>
<h3>1.2.2</h3>
<h3>1.2.3</h3> 

Qual seria a sintaxe?

@ChrisCinelli Tente usar hgroup

<h1>1</h1>
<hgroup>
    <h2>1.1</h2>
        <hgroup>
            <h3>1.1.1</h3>
            <h3>1.1.2</h3>
            <h3>1.1.3</h3>
        <hgroup>
    <h2>1.2</h2>
        <hgroup>
            <h3>1.1.1</h3>
            <h3>1.1.2</h3>
            <h3>1.1.3</h3>
        <hgroup>
<hgroup>

Então hgroup parece ter sido removido do HTML5 (http://html5doctor.com/the-hgroup-element/), além disso, como eu estava dizendo, o problema é mais complexo e as tags de cabeçalho foram usadas apenas por exemplo.
Este é claramente um caso de uso que deve ser permitido e não quebra em nada a filosofia de visão declarativa do Angular ...

Para a saída específica que você está procurando, você considerou o CSS
Contadores?

Ver:
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Counters
http://css-tricks.com/almanac/properties/c/counter-increment/

Na terça-feira, 18 de junho de 2013 às 14h46, Chris Cinelli [email protected] :

Parece que o hgroup foi removido do HTML5 (
http://html5doctor.com/the-hgroup-element/), além disso, como eu estava
dizendo que o problema é mais complexo e as tags de cabeçalho foram usadas apenas para
exemplo.
Este é claramente um caso de uso que deve ser permitido e não quebra em
toda a filosofia de visão declarativa do Angular ...

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -19644594
.

Usei o cabeçalho como exemplo para deixar claro ... na realidade, tenho um <div> relativamente complexo com estrutura diferente para cada um dos níveis da estrutura de dados.

A única solução que encontrei até agora é linearizar a estrutura de dados em Javascript e usar um ng-switch para diferentes níveis e isso exigirá um nível div extra.
Esta solução tem sobrecarga (ou seja, memória e CPU para linearizar a estrutura de dados) e o HTML vai parecer muito menos claro do que o modelo de sublinhado que posso usar no lugar ...

Você pode fazer diretrizes para cada nível? Eu não tenho certeza de que tipo de
estrutura da qual você está falando aqui, então eu estaria agarrado a qualquer coisa.
Mas, na minha experiência, o ng-switch dificilmente é necessário quando você tem
acesso a diretivas e ng-include, e leva a modelos de código espaguete.

Na terça-feira, 18 de junho de 2013 às 16h27, Chris Cinelli [email protected] :

Usei o cabeçalho como exemplo para deixar claro ... na realidade,
div relativamente complexo com estrutura diferente para cada um dos níveis em
a estrutura de dados.

A única solução que encontrei até agora seria linearizar a árvore em
Javascript e use um ng-switch para diferentes níveis.
Esta solução tem sobrecarga (ou seja, memória e CPU para linearizar os dados
estrutura) e o HTML parecerá muito menos claro do que o
modelo de sublinhado que posso ser usado em seu lugar ...

-
Responda a este e-mail diretamente ou visualize-o em Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -19650391
.

É assim que se parece: http://d.pr/i/GSX4
Muitos rótulos curtos (1.xx x), descrições, número de marcas de verificação, etc., vêm do banco de dados.
Estou explorando a opção de converter esta parte para Angular, mas até agora não há dados.

A visão atual é bem menos lógica e deixa relativamente claro o que está acontecendo.
Se eu entendi bem, você está sugerindo que você deve quebrar todos os níveis em um pedaço de javascript.

Isso para mim parece mais confuso, menos coesivo e menos legível. Dada a estrutura de dados que contém todas as informações para exibir este painel, por que preciso usar o código em um arquivo diferente (o módulo / controlador) quando a lógica está completamente relacionada à visualização e muito específica dessa visualização? IMHO, o controlador deve ser (e está agora na implementação atual):

• obter os dados do modelo
• passe o modelo para a vista para que a estrutura possa renderizá-lo

Claro que posso adicionar alguns divs extras e alterar o CSS, mas se isso for necessário para fazê-lo funcionar com o Angular, parece que o Angular está no caminho de como é conveniente e elegante fazer as coisas aqui.

Acho que a ligação de dados em KnockoutJS, que permite ligações a um elemento html <div data-bind="foreach: ..."> , bem como "sintaxe de fluxo de controle sem contêiner", <!-- ko foreach: ... --><!-- /ko --> , é extraordinariamente útil e acho que seria ótimo se O Angular pode suportar um conjunto semelhante de opções de sintaxe, muito parecido com a sintaxe @bowsersenior sugerida.

Para obter mais detalhes sobre a opção "sem contêiner" do Knockout:
http://knockoutjs.com/documentation/foreach-binding.html

+1 para sintaxe virtual @ mg1075 .
KnockoutJS torna mais fácil lidar com coleções dd e aninhadas.
por exemplo, http://stackoverflow.com/questions/20062032/nested-table-using-ng-repeat