Angular: Empty Fiddle

http://angularjs.org/

by Tim Büthe

HTML

<div ng-controller="MyCtrl">
    <div>Hello, {{myModel.name}}!</div>
    <op-list items="myModel.items"> 
        <span>title: {{item.title}}</span>
    </op-list>
</div>

JavaScript

var myApp = angular.module('myApp', []);

myApp.controller('MyCtrl', ['$scope', function ($scope) {
    $scope.myModel = {
        name: 'Superhero',
        items: [{
            title: 'item 1'
        }, {
            title: 'item 2'
        }]
    };
}]);

myApp.directive('opList', function () {
    return {
        template: '<div>' +
            '<div>items ({{items.length}}):</div>' +
            '<ng-transclude ng-repeat="item in items"></ng-transclude>' +
            '</div>',
        restrict: 'E',
        replace: true,
        transclude: true,
        scope: {
            items: '='
        }
    };
});