Ich schreibe eine Anweisung, um eine Liste von Elementen auszugeben. Diese Elemente sollen irgendwo von einem JSON gelesen werden.Wie ruft man eine Funktion zum Rendern von Elementen in einer 'ng-repeat'-Direktive auf?
Jetzt möchte ich jeden Artikel entsprechend einer Methode, die an die Richtlinie übergeben werden würde. Dann rufe ich in meiner Vorlage die Methode an und übergebe sie an das zu rendernde Objekt.
Die Methode selbst wird aufgerufen, aber das übergebene Element ist undefined
.
Wo liege ich falsch und wie kann ich das erreichen?
Sie können mit dem Code sehen und spielen hier: https://jsfiddle.net/zpntqayr/
Hier ist der Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Angular</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.1/angular.js"></script>
</head>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<drop-down-list items="data" display-item="itemToString(item)" />
</div>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("myCtrl", function ($scope, $http) {
$scope.data = [{ "Name": "Value 1", "Value": 1 }, { "Name": "Value 2", "Value": 2 }, { "Name": "Value 3", "Value": 3 }, ] ;
$scope.itemToString = function (item) {
// alert(item);
return item.Name;
};
});
myApp.directive('dropDownList', function() {
return {
restrict: 'E',
replace: true,
scope: {
items: '=',
displayItem: '&'
},
template: '<ul><li ng-repeat="item in items">{{displayItem(item)}}</li></ul>',
};
});
</script>
</body>
</html>
Toll, danke, es funktioniert! Kannst du erklären, was der Unterschied zwischen beiden ist? – remio