Angular: Empty Fiddle

http://angularjs.org/

HTML

<script src="http://code.angularjs.org/angular-1.0.1.js"></script>
<div ng-controller="MyCtrl">
    <div ng-repeat="module in modules">
        <tagname module="module"></tagname>
    </div>
</div>

JavaScript

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

function MyCtrl($scope) {
    $scope.name = 'Superhero';

    $scope.$watch('modules', function (val, old) {
        console.log('Ctrl module list has been changed', val);
    }, true);

    $scope.modules = [{
        title: 'test 0'
    }, {
        title: 'test 1'
    }, {
        title: 'test 2'
    }];
}


myApp.directive('tagname', function () {
    return {
        restrict: 'E',
        replace: true,
        link: function (scope) {
            scope.module.title += ' changed';

            // After $http.get request we have an object with {title: 'Redeclared'}
            // thats why i am doing so...
            // Traget is to automaticly change $scope.modules.[index].title
            // Using angular.forEach($parentScope) -> is bad idea
            // because the goal is to chage it automatically
            scope.module = {
                title: 'Redeclared'
            };
        },
        template: '<div>{{ module.title }}</div>',
        scope: {
            module: '='
        }
    };
});