Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Como passar uma lista para uma diretiva com ng-repeat

Referente ao curso AngularJS: crie webapps poderosas

por José Silas Barros Brandão Júnior
| 223.9k xp | 3 posts

Olá, Gostaria de saber se é possível criar uma diretiva e passar uma lista na sua chamada onde nessa lista seja possível aplicar o ng-repeat. Por exemplo:

Chamada da diretiva

<minha-diretiva lista = {{ listagem }}> </minha-diretiva>

Minha diretiva ficaria mais ou menos assim:

.directive('minhaDiretiva', function(){
    var ddo = {};

    ddo.restrict = "AE";

    ddo.scope = {
        listagem : '@'
    }

    ddo.templateUrl = "table.html";

    return ddo;
});

E o meu HTML ficaria assim:

<table class="table table-bordered table-striped">
                        <tbody>
                            <tr ng-repeat="row in {{ listagem }}">
                            <td scope="row" ng-repeat="cell in row">{{ cell }} </td>
                            </tr>
                            <tr>
                        </tbody>
                        </table>

Da erro no ng-repeat pois ele não aceita as chaves {{ }}. Se eu colocar somente listagem sem chaves da outro erro e se eu colocá-lo fora do ng-repeat com chaves e usar o track by $index ele faz uma lista de cada caracter da listagem. Pelo que entendi o @ passa strings para minha diretiva, o & passa funções. Queria saber se há como passar listas que possam ser usadas no ng-repeat

3 respostas
por José Silas Barros Brandão Júnior
| 223.9k xp | 3 posts

Acho que o = resolve meu problema VLW FLW

por Wanderson Macêdo
| 3964.9k xp | 8086 posts
Instrutor Desenvolvedor

Oi José, tudo bem? Se já conseguiu resolver o problema, compartilha qual foi a solução e marca o tópico como solucionado, tá bem?

Assim outros alunos podem ficar sabendo a solução e a equipe do fórum também fica sabendo que o problema foi resolvido e como foi resolvido. Bons estudos, obrigado! =)

solução!
por José Silas Barros Brandão Júnior
| 223.9k xp | 3 posts

Olá, Wanderson Macêdo. Obrigado pelo comentário. Sim o problema foi resolvido, existem três prefixos disponíveis nas diretivas do Angular: '@' '&' '=' O '@' e o '&' foram explicados no curso, para resolver o problema que levantei é preciso usar o prefíxo '=' que faz uma ligação bilateral da chamada com a diretiva. O código ficou assim: Chamada da diretiva no HTML (sem as chaves)

<minha-diretiva listagem =  "lista" > </minha-diretiva>

Diretiva com o prefixo =

.directive('minhaDiretiva', function(){
    var ddo = {};

    ddo.restrict = "AE";

    ddo.scope = {
        listagem : '='
    }

    ddo.templateUrl = "table.html";

    return ddo;
});

E o table.html ficaria com o ng-repeat assim: (sem as {{}} no ng-repeat)

<table class="table table-bordered table-striped">
                        <tbody>
                            <tr ng-repeat="row in listagem track by $index">
                            <td scope="row" ng-repeat="cell in row">{{ cell }} </td>
                            </tr>
                            <tr>
                        </tbody>
</table>

E isso funcionou, criei minha diretiva para tabelas ^^ Para mais informações compartilho o post que me ajudou na solução: https://www.undefinednull.com/2014/02/11/mastering-the-scope-of-a-directive-in-angularjs/ Obrigado a todos bons estudos ^^