Переменные углового прохода от директивы к контроллеру

Question

Я хотел бы создать директиву, которая содержит много полей и одну кнопку, когда пользователь нажимает кнопку, заполняемая информация должна иметь возможность перейти к функции поиска, которая находится за пределами директивы.

var app = angular.module('myapp', []); 

app.controller("myCtrl", function($scope) { 

    $scope.doSearch = function(query) { 
     query.order="asc"; 
     console.log(query); //do api call 
    } 
}); 

app.directive('queryBuilder', function() { 
    return { 
     restrict: 'E', 
     scope: { 
      queryFn: '&' 
     }, 
     template: "<button ng-click='directiveClick()'>Click</button>", 
     replace: true,   
     link: function(scope, elm, attrs) { 
      scope.directiveClick = function(){ 
      var query={name:"bill",age:12} 
      scope.queryFn(query); 
      } 
     } 
    } 
}); 

view.html

<div ng-controller="myCtrl"> 
     <query-builder query-fn="doSearch()"></query-builder> 
    </div> 

"query" параметр в doSearch() не определено, каким образом я могу принести query объект, который находится внутри функции связи в myCtrl?

Другим методом, который приходит мне на ум, является использование двухсторонней привязки переменной запроса вместо передачи функции поиска. Какой путь лучше?

см Plunkr

Answer 1

Ваш метод, имеющий директива вызова функции вне ее сферы вполне допустимо. Однако, для того, чтобы в связи с работой, вам необходимо:

1, Укажите имена аргументов при использовании директивы

<query-builder query-fn="doSearch(query)"></query-builder> 

2, В директиве, при вызове функции, вы должны пройти объект, где ключи являются именами параметров из # 1.

scope.directiveClick = function(){ 
    var query={name:"bill",age:12} 
    scope.queryFn({query: query}); 
} 

Plunker