динамические директивы в angularjs

ДирективаатрибутыНе меняются при обновлении области, они все еще сохраняют начальное значение. Что мне здесь не хватает?

HTML


    
    works great


<p>works: {{foo}}</p>

Javascript (на примере угловых вкладок на первой странице)

angular.module('myApp.directives', []).
directive('navlist', function() {
    return {
        scope: {},
        controller: function ($scope) {
            var panes = $scope.panes = [];

            this.select = function(pane) {
                angular.forEach(panes, function(pane) {
                    pane.selected = false;
                });
                pane.selected = true;
            }

            this.addPane = function(pane) {
                if (panes.length == 0)
                    this.select(pane);
                panes.push(pane);
            }

        }
    }
}).
directive('navelem', function() {
    return {
        require: '^navlist',
        restrict: 'E',
        replace: true,
        transclude: true,
        scope: { href: '@href' },
        link: function(scope, element, attrs, tabsCtrl) {
            tabsCtrl.addPane(scope);
            scope.select = tabsCtrl.select;
        },
        template:
            '<a href="{{href}}" ng-transclude=""></a>'
    };
});

Ответы на вопрос(3)

Ваш ответ на вопрос