Det ser ikke ut til å fungere å legge til parameter i ng-click-funksjonen i ng-repeat.

Jeg har en enkel løkke med ng-repeat som dette:

<li ng-repeat='task in tasks'>
  <p> {{task.name}}
  <button ng-click="removeTask({{task.id}})">remove</button>
</li>

Det er en funksjon i kontrolleren $scope.removeTask(taskID).

Så vidt jeg vet vil Angular først gjengi visningen og erstatte interpolert {{task.id}} med et tall, og deretter, ved klikkhendelse, evaluere ng-click-strengen.

I dette tilfellet får ng-click helt det som er forventet, dvs: ng-click="removeTask(5)". Men... det' er ikke å gjøre noe.

Selvfølgelig kan jeg skrive en kode for å få task.id fra $tasks array eller til og med DOM, men dette virker ikke som Angular måte.

Så, hvordan kan man legge til dynamisk innhold til ng-klikk direktiv inne i en ng-repeat loop?

Jeroen
Redigerte spørsmål 18. juli 2015 в 12:32
Programmering
angularjs angularjs-ng-click ng-repeat
11. juni 2013 в 8:47
6 visninger
Løsning

I stedet for

remove

gjør dette:

remove

Vennligst se denne fela:

http://jsfiddle.net/JSWorld/Hp4W7/34/

Sabarish Sankar
Redigert svar 11. juni 2013 в 8:56
Kommentarer (3)

En ting som virkelig hengte meg opp, var da jeg inspiserte denne html-en i nettleseren, i stedet for å se den utvidet til noe sånt som:

remove

så jeg

remove

Sistnevnte fungerer imidlertid!

Dette er fordi du er i "Angular World", når du er inne i ng-click="" Angular all ready vet om task.id som du er inne i den "s modell. Det er ikke nødvendig å bruke databinding, som i {{}}.

Videre, hvis du ønsket å passere selve oppgaveobjektet, kan du like:

remove
Hans
Redigert svar 10. mars 2015 в 6:51
Kommentarer (3)

dette fungerer. takk. Jeg injiserer tilpasset html og kompilerer den ved hjelp av vinkel i kontrolleren.

        var tableContent= '<div>Search: <input ng-model="searchText"></div>' 
                            +'<div class="table-heading">'
                            +    '<div class="table-col">Customer ID</div>'
                           + ' <div class="table-col" ng-click="vm.openDialog(c.CustomerId)">{{c.CustomerId}}</div>';

            $timeout(function () {
            var linkingFunction = $compile(tableContent);
            var elem = linkingFunction($scope);

            // You can then use the DOM element like normal.
            jQuery(tablePanel).append(elem);

            console.log("timeout");
        },100);
Kommentarer (0)