AngularJS - 无法在另一个指令中访问指令控制器

时间:2014-10-28 22:37:13

标签: angularjs scope require directive

我有两个angularjs指令(extWindow和taskBar),并希望将taskBar的控制器注入extWindow以访问它的范围。因为它们没有我使用的相同范围

require : '^$directive'

包含它的语法。 这样做我可以摆脱错误'控制'taskBar',指令'extWindow'所需,无法找到!'但是在extWindow指令的link(..)方法中仍未定义TaskBarCtrl。

有任何建议如何解决?

var mod = angular.module('ui', [])
.directive('taskBar', function() {

    var link = function(scope, el, attrs) { 
        $(el).css('display', 'block');
        $(scope.titles).each(function(i,t) {
            el.append('<span>' + t + '</span>')
        });
    };

    return {
        scope: {},
        restrict : 'E',
        controller: function($scope, $element, $attrs) {

            $scope.titles = [];

            this.addTitle = function(title) {               
                $scope.titles.push(w);
            };

            this.removeTitle = function(title) {
                $scope.titles = jQuery.grep(function(n,i) {
                    return title != n;
                });
            }
        },
        link: link
    };
}).directive('extWindow', function() {  

    return {
        scope: {},
        require: '^?taskBar',
        restrict: 'E',
        transclude: true,
        template: '<div class="ui-window">\
            <div class="ui-window-header"><span>{{windowTitle}}</span><div class="ui-window-close" ng-click="close()">X</div></div>\
            <div class="ui-window-content" ng-transclude></div>\
            </div>',
        link: function(scope, element, attrs, taskBarCtrl) {
            scope.windowTitle = attrs['windowTitle'];   
            scope.close = function() {
                $(element).css('display', 'none');
            }
            //taskBarCtrl is not recognized!!!
            taskBarCtrl.addTitle(scope.windowTitle);
        }
    }
});

http://jsfiddle.net/wa9fs2nm/

谢谢。 golbie。

1 个答案:

答案 0 :(得分:1)

如果你的父指令有一个控制器,你需要像。

this.scope = $scope;
this.attrs = $attrs;

在你的儿童链接功能中你需要像

这样的东西
var Ctrl = ctrl || scope.$parent.tBarCtrl;

这是Plunker