web-dev-qa-db-fra.com

Passer la fonction de rappel à la directive

J'essaie de passer une fonction de rappel d'un contrôleur à une directive.

Voici le code de la fonction de rappel:

$scope.onImageSelect = function(image) {
    alert('SET');
    $scope.card.image = image;
};

Utilisation de la directive:

<google-image-search callback="onImageSelect" />

Code de la directive:

ngmod.directive('directive', function() {
    return {
        templateUrl: '/templates/template.html',
        scope: {
            callback: '&'
        }
    }
});

Utilisation du rappel dans le modèle:

<a data-ng-click="callback(url)"></a>

Cependant, cela me donne l'erreur suivante:

TypeError: Cannot use 'in' operator to search for 'onImageSelect'

J'ai vu beaucoup de questions similaires, mais je ne comprenais pas où je me trompais. 

javascriptangularjsangularjs-directiveangularjs-ng-clickgoogle-image-search
16
Mike

Lorsque vous appelez la méthode d'expression à partir de la directive, vous devez transmettre le paramètre de la directive au format JSON. Vous devez également corriger la valeur de l'attribut de la directive callback pour passer la fonction telle que callback="onImageSelect(image)".

Utilisation de la directive: 

<google-image-search callback="onImageSelect(image)" />

Modèle de directive 

<a data-ng-click="callback({image: url})"></a>
28
Pankaj Parkar

Utilisez simplement:

<google-image-search callback="onImageSelect(image)" />

Cet exemple du guide du développeur AngularJS est assez similaire à votre cas: http://plnkr.co/edit/hYBxk070sgw54RElyWNq?p=preview

1
Joy

Le code suivant est testé et fonctionne .. 

Directive call in html

<taxcode-picker call-back-fun="calculate_tax(a, b)"></taxcode-picker>

Exemple de code de directive

{
scope:'&',
link: function (scope, element, attrs) {
 scope.tax = {amount:12, rate:10.50};
 scope.obj = {number:12, value:10};

  scope.call_back = function (tax) {
    scope.callBackFun({a:tax, b:obj});
  }
}

}

Contrôleur d'échantillon

app.controller("sample", function($scope){
$scope.calculate_tax = function (tax, obj) {

        console.log("tax "+JSON.stringify(tax));

        console.log("obj "+JSON.stringify(obj));
    }
});
0
Dinesh Vaitage