Eu tenho um loop simples com ng-repeat
assim:
<li ng-repeat='task in tasks'>
<p> {{task.name}}
<button ng-click="removeTask({{task.id}})">remove</button>
</li>
Há uma função no controlador $scope.removeTask(taskID)
.
Até onde eu sei, o Angular renderizará primeiro a exibição e substituirá interpolado {{task.id}}
por um número e, em seguida, no evento click, avaliará a ng-click
string.
Nesse caso, ng-click
obtém totalmente o que é esperado, ou seja: ng-click="removeTask(5)".
No entanto ... não está fazendo nada.
Claro que posso escrever um código para obter task.id
da $tasks
matriz ou até do DOM, mas isso não parece da maneira angular.
Então, como adicionar conteúdo dinâmico à ng-click
diretiva dentro de um ng-repeat
loop?
angularjs
ng-repeat
angularjs-ng-click
Paweł Szymański
fonte
fonte
ng-click
expressão não usar colchetes, ou seja,ng-click="taskData.currentTaskId = task.id"
Uma coisa que realmente me desligou foi quando inspecionei esse html no navegador, em vez de vê-lo expandido para algo como:
Eu vi:
No entanto, o último funciona!
Isso ocorre porque você está no "Mundo Angular", quando dentro do ng-click = "" O Angular já está pronto para conhecer o task.id como você está dentro do modelo. Não há necessidade de usar a ligação de dados, como em {{}}.
Além disso, se você quiser passar o objeto de tarefa, poderá gostar de:
fonte
Também vale ressaltar, para as pessoas que encontram isso em suas pesquisas, é isso ...
Observe o valor de
ng-click
. O parâmetro transmitido paragoTo()
é uma sequência de uma propriedade do objeto de ligação (thebutton
), mas não é colocada entre aspas. Parece que o AngularJS lida com isso para nós. Fiquei desligado por alguns minutos.fonte
isso funciona. obrigado. Estou injetando html personalizado e compilá-lo usando angular no controlador.
fonte
As respostas acima são excelentes. Você pode ver o exemplo de código completo a seguir para saber exatamente como usar
fonte
HTML:
Script Java:
fonte
Aqui está a função ng repeat com ng click e anexar com o slider
fonte