3

分離されていないスコープを持つ AngularJS ディレクティブがあります。ただし、ディレクティブのみに分離したい変数が 1 つあります (「isOpen」フラグです)。例えば：

app.directive('myDir', function() {
    return {
        restrict: 'A',
        scope: {},
        link: function(scope, element, attrs) {
            scope.isOpen = false;
        }
    }
});

...私に孤立したスコープを与えます。myDir の前のどこかにコントローラーを割り当て、そのコントローラーのスコープを myDir 内で使用できるようにすると同時に、scope.isOpen を分離して、このディレクティブの複数のインスタンスを 1 つのページに配置できるようにする必要があります。

4

1 に答える 1

8

$parent親コントローラーのスコープは、ディレクティブのスコープのプロパティを介してスコープを分離した場合でも、ディレクティブ内で使用できます。

app.directive('myDir', function() {
    return {
        restrict: 'A',
        scope: {},
        link: function(scope, element, attrs) {
            scope.isOpen = false;
            scope.$parent.whatever; //this came from your containing controller.
        }
    }
});

ただし注意してください...この方法でディレクティブとコントローラーを密結合するのは非常に簡単になります。ほとんどの場合、次のように、スコープのプロパティをマークアップのスコープ宣言と属性にリンクする方がよいでしょう。

ディレクティブ:

app.directive('myDir', function() {
    return {
        restrict: 'A',
        scope: {
           propFromParent: '=prop',
           funcFromParent: '&func'
        },
        link: function(scope, element, attrs) {
            scope.isOpen = false;
            scope.$parent.whatever; //this came from your containing controller.
        }
    }
});

マークアップ:

<my-dir prop="foo" func="bar()"></my-dir>

あなたのコントローラー:

app.controller('SomeCtrl', function($scope) {
    $scope.foo = 'test';
    $scope.bar = function() {
       $scope.foo += '!';
    };
});
于 2012-10-26T17:40:43.840 に答える