Bon moyen de passer des fonctions de la directive pour l'exécution en lien

Ici, c'est pourquoi je downvoted la réponse.

Tout d'abord, vous ne devriez jamais utiliser le '=' pour passer à la fonction des références à des directives.

'=' crée deux montres et les utilise pour s'assurer que la directive de l'étendue et de la portée parent références sont les mêmes dans les deux sens de la liaison). C'est une très mauvaise idée que de permettre à une directive visant à modifier la définition d'une fonction dans votre parent, qui est ce qui se passe lorsque vous utilisez ce type de liaison. Aussi, les montres doivent être réduites au minimum, même si cela fonctionne, les deux extra $montres sont inutiles. Donc, il n'est pas bien, une partie de la baisse de vote a été pour ce qui suggère que c'était.

Deuxième - la réponse déforme ce que " &". & n'est pas un moyen de liaison". Il obtient que les abus de langage tout simplement parce que, contrairement '=', il ne crée pas de $de montres et de modification de la valeur de la propriété dans le champ d'application de la directive ne se propagent pas à la société mère.

Selon les docs:

& &attr - fournit un moyen pour exécuter une expression dans le contexte de
la portée parent

Lorsque vous utilisez le & dans une directive, il génère une fonction qui retourne la valeur de l'expression évaluée à l'encontre de la portée parent. L'expression n'a pas à être un appel de fonction. Il peut être valable, toute angulaire de l'expression. En outre, cela a généré fonction prend un argument d'objet qui peuvent modifier la valeur d'une variable locale a trouvé dans l'expression.

D'étendre l'OP exemple, supposons que le parent utilise cette directive de la manière suivante:

<my-component foo="go()">

Dans la directive (modèle ou de la fonction de lien), si vous appelez

foo({myVal: 42});

Ce que vous faites est l'évaluation de l'expression "aller()", ce qui arrive d'appeler la fonction "go" sur la portée parent, en passant pas d'arguments.

Sinon,

<my-component foo="go(value)">

Vous êtes l'évaluation de l'expression "aller(valeur)" sur la portée parent, qui est essentiellement l'appel de $parent.aller($parent.valeur)"

<my-component foo="go(myVal)">

Vous êtes l'évaluation de l'expression "aller(myVal)", mais avant que l'expression est évaluée, myVal sera remplacé par 42, de sorte que l'expression évaluée sera "go(42)".

<my-component foo="myVal + value + go()">

Dans ce cas, $champ d'application.foo({myVal: 42}) renvoie le résultat de:

42 + $parent.value + $parent.go()

Essentiellement, ce modèle permet la directive, à "injecter" des variables que le consommateur de la directive peut éventuellement utiliser dans les foo expression.

Vous pourriez faire ceci:

<my-component foo="go">

et dans la directive:

$scope.foo()(42)

$champ d'application.foo() permettra d'évaluer l'expression "aller", qui renvoie une référence à l' $parent.aller à la fonction. Il va ensuite appeler comme $parent.aller(42). L'inconvénient de ce modèle est que vous obtenez un message d'erreur si l'expression n'évalue pas à une fonction.

La dernière raison de la baisse de vote était l'affirmation que le ng-événement directives utiliser &. Ce n'est pas le cas. Aucun des la construction dans les directives de créer isolé étendues avec:

scope:{
}

La mise en œuvre de la "&foo' est (simplifié pour plus de clarté), se résume à:

$scope.foo = function(locals) {
    return $parse(attr.foo)($scope.$parent, locals);
}

La mise en œuvre de ng-click est similaire, mais (aussi simplifié):

link: function(scope, elem, attr) {
    elem.on('click', function(evt) {
        $parse(attr.ngClick)(scope, {
             $event: evt
        }
    });
}

De sorte que la clé à se rappeler est que lorsque vous utilisez '&', vous n'êtes pas passage d'une fonction - vous êtes de passage à une expression. La directive peut obtenir le résultat de cette expression à tout moment en appelant la fonction générée.

OriginalL'auteur Joe Enzminger