I have this peace of code:
<item ng-repeat="name in names"></item>
item.html
name.first
name.family
name
name
app.component('item', {
templateUrl: '/views/item.html'
});
Here is an example plnkr:
index.html
<body ng-controller="MainCtrl">
<item data="name" ng-repeat="name in names"></item>
</body>
script.js
var app = angular.module('plunker', []);
app.controller('MainCtrl', function($scope) {
$scope.names = [{family: "asdf", first: "test"}, {family: "qwerty", first: "test2"}]
});
angular.module('plunker').component('item', {
templateUrl: 'item.html',
bindings: {
data: '='
}
});
item.html
{{$ctrl.data.first}}
{{$ctrl.data.family}}
<br>
Basically what you have to do is use bindings to bind the data you are looping with ng-repeat to access it within your component.