Question

我对如何将函数（委托）传递给AngularJS中的指令并在link-function中使用它有点不知所措。也许我完全不在了，所以非常感谢您对如何做到这一点的任何指示。

我有以下控制器

        myApp.controller("QuestionCtrl", function($scope, $http) {

           $scope.filter = function(query) {
            console.log("filter filter", query);
           };

           $scope.replace = function(query, key) {
            console.log('replace replace');
           };
        }

这是标记

<a class="Add Button" href="#" onsearch="filter(query)" onreplace="replace(hello, world)" showpane="#AddQuestionPane"><span>Ny fråga</span></a>

正如你所看到的，我有2个属性指向我想要在我的指令中使用的范围上的函数。

myApp.directive("searchreplace", function() {

        return {
            restrict: 'A',
            scope: {
                onsearch: "&",
                onreplace: "&"
            },
            link: function(scope, element, attrs) {
                element.bind("dblclick", function() {
                    scope.editMode = !scope.editMode;

                    if (scope.editMode) {
                        var replaceBox = angular.element('<input type="text" class="Search" placeholder="Ersätt" />');
                        replaceBox.keyup(function() {
                            //How do I call onsearch? Yes it is the wrong method, just a test
                            scope.onsearch({ query: replaceBox.val() });
                        });
                        element.after(replaceBox);
                    } else {
                        element.siblings(".Search").remove();
                    }
                });
            }
        };
    });

我不能为我的生活弄清楚如何在范围内调用方法。我想在标记中指定它。这可能吗？

有更好的解决方案可供使用吗？

Answer 1

正如您所看到的，我将onsearch和onreplace方法放在错误的元素上，当然它不起作用。我的傻瓜！在将属性移动到右边元素（带有searchreplace的元素）后，一切正常。

将函数传递给AngularJS指令

1 个答案: