Передача аргументов из директивы в функцию контроллера

Я видел много таких вопросов, но не нашел решения, которое работает. вот скрипка, которая не работает, но должна работать.

Http://jsfiddle.net/cdparmeter/j2K7N/2/

Контроллер: 

$scope.foo = function (textArray) {
    console.log(textArray)
};

Директива: 

return {
    restrict: 'E',
    replace: 'true',
    scope: {
        methodToCall: '&method'
    },
    template: "<div>
        <input ng-model='textToPush'/>
        <button ng-click='pushText'>Push</button>
        <button ng-click='finish'>Finish</button>
    </div>",
    link: function (scope, element, attrs) {
        scope.paragraphs = [];
        scope.pushText = function () {
            scope.paragraphs.push(scope.pushText);
            scope.pushText = "";
        }
        scope.finish = function () {
            scope.methodToCall(scope.paragraphs)
        }
    }
}

HTML: 

<div ng-app="MyApp">
    <div ng-controller="MyController">
        <container data-method="foo">
    </div>
</div>

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

1 7
javascript angularjs angularjs-directive angularjs-controller

1 ответ:

Прежде чем ответить на ваш вопрос, я должен сказать, что ваш сценарий содержит несколько ошибок:

  1. вы связываете входные данные с переменной под названием textToPush, а затем используете другую внутри функции pushText (pushText);
  2. Вы неправильно задаете директиву ng-click; она должна быть ng-click="pushText()" вместо ng-click="pushText". То же самое для finish;
А теперь вернемся к вашему вопросу. Для вызова функции родительской области, передающей аргументы, можно получить ссылку на нее сначала выполните функцию, а затем выполните ее: 
scope.finish = function () {
  var func = scope.methodToCall();                
  func(scope.paragraphs);
}

Вотрабочая версия вашего сценария.

Вы также можете сделать это, если хотите: 

scope.finish = function () {
    scope.methodToCall({value: scope.paragraphs});                                
}

Но чтобы этот код работал, вы должны изменить свою разметку на: 

<container data-method="foo(value)"/>

Вот еще один jsFiddle, показывающий решение выше.

12